Rear Window
Rear Window lets you easily create iframes with HTML contents.
Example Usage
// assuming browserify is in placevar RW = ; var container = document;documentbody; var options = styleString: 'body { color: rgb(255, 0, 0); }' content: '<p>Lorem Ipsum</p>'var iframe = RW; // note - update() overwrites any existing body contentsRW;
Installation
Rear Window is written with a module definition to support:
- Global inclusion in a browser, just include the
rear-window.js
file and you will getRW
in the global scope - AMD / RequireJS -
require(['rear-window/rear-window'], function(RW) {/* ...*/ })
- CommonJS-style / Browserify -
var RW = require('rear-window')
API
RW.create(HTMLElement container, Object options)
- Creates a new iframe, appended to
container
. - Returns the HTMLIFrame element.
- Supports the following options:
Option | Type | Description |
---|---|---|
options.iframeAttributes |
Object | Attributes to apply to the iframe, such as id , style , frameborder , etc. The key classString will be mapped to the class attribute. |
options.styleString |
String | Will be inserted into the head of the iframe, as the contents of a <style> tag |
options.styleLink |
[String|Array] | Will be inserted into the head of the iframe as the href of one or more <link rel="stylesheet"/> tags |
options.content |
String | Contents to inject into the <body> of the new iframe |
Example:
// assuming global <script> inclusionvar RW = windowRW; var container = document;documentbody; var options = iframeAttributes: classString: 'iframe-noborder full-height etc' // mapped to 'class' id: 'one-and-only-iframe' 'data-foo': 'bar' styleString: 'body { color: #ff0000; }' styleLink: 'styles/iframe.css' // an array of URLs is also acceptable content: '<h1>Sample Content</h1><p>No need to call update()</p>'; var iframe = RW;
RW.update(HTMLIFrameElement iframe, String contents)
- Updates the
<body>
content of an existing iframe. - Does not have to be an iframe created by rear-window.
- Overwrites existing content.
- Leaves the
<head>
untouched.
Example
// assuming browserify is in placevar RW = ; var container = document;documentbody; var iframe = RW;RW;// note - update() overwrites any existing body contentsRW;