Bookmarklets
These mini-JavaScripts are intended to be designers' tools only, and would serve little purpose as part of a page. Each one is custom written for friends or readers.
Drag these bookmarklets to your bookmarks bar (or add the links to your bookmarks) and click them to use them.
Images
- Image HTML: Shows the HTML for images and allows you to edit it (IE and Opera only) - [Instructions: open the page, click the bookmarklet, click on an image to see its HTML. To edit an image again after you have edited it once, click the bookmarklet again]
- Image ALT: Shows the ALT text for images (all browsers *) - [Instructions: open the page, click the bookmarklet, click on an image to see its ALT text]
- Human SRC: Shows the SRC for images, formatted in title case (all browsers *) - [Instructions: open the page, click the bookmarklet, click on an image to see its formatted SRC]
- ALT title: converts all available image alt attibutes into titles (all browsers *)
- Resume images: If the images on a page stop loading (for example, because you clicked a link) this can usually cause image loading to resume (Opera)
- Reload imgs: Attempts to reload all images on the page (all browsers *) - [Note: reloading the page may revert to the original images!]
- Reload img: Attempts to reload single images on the page (Opera) - [Instructions: open the page, click the bookmarklet, click on an image to reload it - Note: you may need to focus another page then return to the current page for the changes to show]
Links
- Link HTML: Shows the HTML for links (IE and Opera only) - [Instructions: open the page, click the bookmarklet, click on a link to see its HTML]
- Human HREF: Shows the HREF for links, formatted in title case (all browsers *) - [Instructions: open the page, click the bookmarklet, click on a link to see its formatted HREF]
- No blank: Prevents links and forms from using target="_blank" (all browsers *) - [Instructions: open the page, click the bookmarklet, no links or forms will use target="_blank"]
Forms
- Tick all: Ticks all checkboxes on the page (all browsers *)
- Untick all: Unticks all checkboxes on the page (all browsers *)
- (Un)Tick all: Alternates between tick-all and untick-all (all browsers *)
- Save forms and Recover forms: Saves and recovers the contents of forms (max ~3KB) using cookies (all browsers *)
- Passwords: Displays a list of all passwords in forms on the current page - for use with recovering passwords (Opera 7+, IE 5+, Mozilla/Netscape 6+, Safari/Chrome) - [Instructions: Open the page. If needed, make your password manager fill in the form (with Opera, click the "Log In" button). You may need to click the 'stop' button immediately to stop the next page loading. Click the bookmarklet. The passwords should be displayed.]
Styles
- Stylesheets: Opens a window with links to every stylesheet used on the page - if there is only one stylesheet, it will be opened immediately (Opera 7+, IE 5+, Mozilla/Netscape 6+, Safari/Chrome)
- CSSDOM: Searches the page and all frames for inline, linked, and imported stylesheets, and displays their contents in a list, with links to all relevant files (Opera 9+, Mozilla)
-
KeyZoom:
Allows page text and images to be zoomed using + - and * keys (IE only) - [Instructions: open the page, click the bookmarklet, then you can press + to zoom in, - to zoom out and * to reset to no zoom] - warning: IE's zoom algorithm is not perfect - parts of the page sometimes disappear or forms stop working.
Add this link to your page to make it more accessible - even zooms pixel sized fonts.
Misc
- DOM path: Uses the status bar to display the DOM path to the element under the mouse (Opera 7+, IE 5+, Mozilla/Netscape 6+, Safari/Chrome) - [Instructions: open the page, click the bookmarklet, move the mouse over the page to see the DOM path in the status bar - Note: some browsers have the status bar hidden by default]
- Force HTML: When pages are incorrectly served as text/plain when they should be text/html, Opera and Mozilla/Netscape 6+ will correctly render them as text. Use this bookmarklet to render them as HTML (Opera 7.5-, Mozilla/Netscape 6+)
- Scripts: Opens a window with links to every external script used on the page - if there is only one script, it will be opened immediately (Opera 7+, IE 5+, Mozilla/Netscape 6+, Safari/Chrome)
- JSTidy: Searches the page and all frames for scripts, tidies their contents, and displays them in a list, with links to all relevant files (Opera 8-9.2x [also works in 9.5+ without tidying])
- GreenButton: Makes the menus work on thegreenbutton.com (Opera 7+) - does not appear to be necessary any more, as the site has removed the menus - [Instructions: open the page, click the bookmarklet, the menus should work with a couple of minor rendering bugs - the 'In The Media' menu may not appear until you hold your mouse over it]
- List IDs: Displays a list of all header elements with ID attributes on the page (Opera 7+, IE 5+, Mozilla/Netscape 6+, Safari/Chrome)
- Source: Attempts to show the source code of pages, even if they were created dynamically - Note, the browser may choose to reformat or rewrite parts of the source, and the doctype tag will be missing, so this is not as perfect as a real source view (IE and Opera only)
- Highlight: Attempts to syntax highlight JavaScript code for JavaScript files that you open (Opera 7.5+, Mozilla/Netscape 6+) - [Instructions: this one is a bit complicated. Firstly, download this zip file => bookmarkletSyntax.zip <= and open it. Copy the file it contains to somewhere on your computer. Then use this form to select it: Then use the link the same way as you would use any of the other bookmarklet links. - When you click it, it will open a window, but it may take a few seconds to highlight the code, please wait and allow it to do so]
* Layers browsers (Netscape 4, Escape 4) will not work with elements that have been positioned using CSS 2.