Modal Image Box
Friday October 3, 2008
In page picture galleries are more user friendly than ones that use a popup window
With popup windows falling from favour with web visitors, you may prefer to use an alternative method of displaying larger versions of the images in a picture gallery. There may also be times where you don't want your visitor leaving the popup open when they return to the original page.
Adding this unobtrusive JavaScript to your web page will change all of the links in the page that reference images. Instead of the images loading as separate pages in the browser window they will instead load as modal overlays in the current web page.
Modal Image Box
thank you so much
http://www.dreamscity.net
Great work with the modal image box.. Thanks!
I was trying to integrate your code for my blog at blogger.com. Somehow it was not working. Turns out, the URL of an image uploaded to Blogger has to modified slightly (remove “-h” from URL).
May be you already know this, but just in case, an example:
Some how the -h after s1600 has to be removed for your code to work:
http://3.bp.blogspot.com/_vsQ_G2OOspQ/SdWq6QUW_QI/AAAAAAAAAd8/oLJKcpG_fqk/s1600-h/image.png
I added your Javascript and CSS code to my Blogger template HTML and because of the above mentioned problem all images on my blog stopped working. So I had to change your code to check for a rel attribute in every element, so that the modal box thing works only for anchors having the rel tag (I will add the rel tag only for images which I have removed the -h).
Now off to removing “-h” from more than 70 posts..
Thanks again!