Show Titles Bookmarklet

March 5th, 2009

The show titles bookmarklet is a small piece of JavaScript I wrote to make all title attributes (AKA hovertext or hover text) visible on a webpage. Since this script shows hover text without requiring an actual hover, it lets you see hovertext on the iPhone and in other situations where you can’t (or don’t want to) use a mouse.

To use it, bookmark this link: Show Titles, then click or otherwise activate it to make the body element titles appear on the page you’re browsing. (I have a keyboard shortcut assigned to mine.)


script results on a Cute Overload blog post with overlaid titles

What is hover text, and why would I want to see it?
As seen in the above screenshot, some image-based blogs (and web comics like Daisy Owl) supplement their images with title content that adds a little something extra. If you don’t hold your mouse over the image and read the popup, you miss something.
So why don’t I just use my mouse?
  • You might want to focus on reading instead of mouse-moving, especially when you’re catching up on a backlog of entries.
  • You could be on an iPhone, which has no hover functionality.
The web developer toolbar has an option for this, at Information > Display Title Attributes.
That’s true. This bookmarklet can be used in non-Firefox browsers.

Daring Fireball’s JavaScript Bookmarklet Builder easily converted this script to bookmarklet form. (Thanks, John Gruber.)

Source code:

Trackback URL

Comments RSS

Leave a Reply