Skip to content
lukes edited this page Sep 13, 2011 · 7 revisions

Link rear-window.js into your document

Use one of the following three methods to load the Rear Window JavaScript file into your document:

By Bookmarklet

There's one prepared here.

Great for inspecting on the fly without altering your document. See this Wikipedia article for information about what Bookmarklets are.

By Downloading

From https://github.com/lukes/rear-window.js/raw/master/lib/rear-window.js

Save the file to somewhere on your computer, then add the following into your document:

<script type="text/javascript" charset="utf-8" src="js/rear-window.js"></script>

Replace js/rear-window.js with the location you saved the file to.

By Hotlinking

Copy and paste this into your document:

<script type="text/javascript" charset="utf-8" src="https://github.com/lukes/rear-window.js/raw/master/lib/rear-window.js"></script>

Usage

To load the Rear Window panel, either in your Firebug or Webkit console, or between script tags in your HTML document, type:

Rear();

Or to load the panel starting on a particular variable, type:

Rear('my_var');

Where 'my_var' is the name of the variable, passed as a string.

Examples

Download the complete Github repository:

git clone git://github.com/lukes/rear-window.js.git

Open the .html files in rear-window.js/demos in your web browser.

Custom CSS

Rear Window remotely loads its CSS into your document, but you can override this by providing a css param.

Rear({css: 'style.css'});
Rear('my_var', {css: 'style.css'});

Note, you probably want to look at the uncompressed CSS to start you off in over-riding the styles.

Questions

What's a "Native Function" type?

This is when the function is written in something like C, in the JavaScript engine itself, rather than is implemented in JavaScript code. To inspect these functions you'll need to view the uncompiled browser's source code.

Clone this wiki locally