It worked great, unless the images were bigger than about 400px on a side. Then Firefox didn’t like it and the ‘close’ button’s functionality was lost (actually the clickable part was just pushed down in the y direction so that you couldn’t get to it to close the image. This problem didn’t occur in IE (to my amazement), just in FF and Opera.

So back to the drawing board. I really liked the way the script functioned so I went looking for similar ones and came across Thickbox. This is another JavaScript/Ajax tool, it functions nearly identically but for my purposes this one was the better choice because it doesn’t break on large images.

Well, let me clarify – Thickbox is set by default to resize images larger than the current browser window. I tried changing this in the code, but if you don’t use it you can’t scroll up or down to see the rest of the image. So

I put the code back to its original state and showed the result to my client. He’d originally wanted to show 800px images, too big for Firefox/Opera if I used Lightbox JS and forcing a resize in Thickbox. But he was okay with the resizing and is now happy with the results.

Here’s his page with Thickbox in action. Pretty cool and it really only took about 30 minutes to get it installed and running once I decided to use it.

Comments

Tag:

Add to Del.icio.us | Digg | Reddit | Furl

Bookmark WebProNews:

About the Author

Debbie Campbell

Parallax Web Design | Web Design Blog