Read alt/title text on iPhone OS devices via bookmarklet

Apr 06, '10 07:30:00AM

Contributed by: boxcarl

If you’re like me, you read a lot of webc omics, and for a lot of web comics, the best joke comes only when you hover your mouse over the image, and a tooltip shows up with the last word. These are sometimes called “alt text” or “title text” jokes, since they are encoded by adding alt="text" title="text" to the img tag’s source code.

This works great on a Mac, but what about when you’re using a iPhone, iPod touch, or iPad? With no cursor, there’s no ability to hover over an image. To get around this, I’ve cobbled together a simple bookmarklet.

First install the bookmarklet by dragging the following JavaScript to your toolbar in Safari, then sync your iDevice (assuming you're syncing Safari bookmarks, of course).

javascript:for(var%20imCt=0;document.images%5BimCt%5D;imCt++)%7Bvoid(document.images%5BimCt%5D.onclick=function%20()%20%7Bif(this.title)%7Bif((window.brbanta=prompt('Image%20title%20text:%5Cn(Click%20OK%20to%20insert%20this%20text%20before%20the%20image)',this.title))&&this.parentNode)%7Bthis.parentNode.insertBefore(document.createTextNode('%20'+brbanta+'%20'),this);%7D%7Delse%20if(this.alt)%7Bif((window.brbanta=prompt('Image%20alt%20text:%5Cn(Click%20OK%20to%20insert%20this%20text%20before%20the%20image)',this.alt))&&this.parentNode)%7Bthis.parentNode.insertBefore(document.createTextNode('%20'+brbanta+'%20'),this);%7D%7D%20else%20%7Balert('There%20is%20no%20title%20or%20alt%20text%20for%20this%20image');%7D%7D);%7D
After that, all you need to do is visit the web page in question, activate the bookmarklet from your bookmarks in Safari, then click on the image whose alt text or title text you want to read. Fun!

[robg adds: I haven't tested this one.]

Comments (7)


Mac OS X Hints
http://hints.macworld.com/article.php?story=20100404045906105