Firebug/Dev Tools-like DOM outline implementation using jQuery.
var myExampleClickHandler = function (element) { console.log('Clicked element:', element); }
var myDomOutline = DomOutline({ onClick: myExampleClickHandler, filter: 'div' });
// Start outline:
myDomOutline.start();
// Stop outline (also stopped on escape/backspace/delete keys):
myDomOutline.stop();| Option | Description | Default |
|---|---|---|
| borderWidth | The width of the outline border, in pixels. | 2 |
| onClick | The function fired when the user clicks while the DOM outline is active. Receives the target element as an argument. | false |
| namespace | The private namespace used for CSS selectors and events. Available in the unlikely event of possible event/CSS collisions. | 'DomOutline' |
| filter | A selector that an element should match in order to be outlined and clicked. By default no filter is applied. | false |
- Tested to work in Chrome, FF, Safari. Buggy in IE ;(
- Creates a single global variable:
window.DomOutline