Today was my first time using Thickbox, and I’m pretty satisfied. It’s got all the features I was looking for, namely “pop-in” images, iframes and galleries.

I didn’t really like how you had to add a querystring for the Thickbox iframes (I would prefer to use the rel attribute), but it still works fine.

Gallery Images Not Working

I’ve been banging my head against the keyboard for hours trying to fix this one little bug with Thickbox. For some reason, when I used the Thickbox Image Gallery, I couldn’t get the image to appear at all!

The Thickbox Image Gallery is where you open up one image in a gallery and then you can click “next” and “previous” to see the other images in the gallery. Thickbox uses the “rel” attribute for this, but for some reason, adding the “rel” attribute completely breaks it. When you click on the image, it starts the loading image… but doesn’t go anywhere. It just sits there with the loading image displayed.

Thank you to Stuff by Sarah for finding the following fix:

It seems that there is a minor change required for thickbox to work with the latest jQuery version. After a bit of searching around I found out that what’s needed is on line 79 of the existing thickbox file you need to change the line

Existing Thickbox Code
  1. TB_TempArray = $(”a[@rel="+imageGroup+"]“).get();

to not include the @ sign in it ie.

New Thickbox Code
  1. TB_TempArray = $(”a[rel="+imageGroup+"]“).get();

Such a simple change that caused a few hours of frustration! So hopefully it may be of use to someone else :)

Compressed Thickbox fix

I happened to have the compressed version, but was still able to find the Gallery fix myself. You can replace:

Existing Thickbox (Broken) Code
  1. {E=$(”a[@1N="+g+"]

to not include the @ sign in it:

New Thickbox Code
  1. {E=$(”a[1N="+g+"]

And that’s it. I was definitely glad to find a solution, I hope this helps you too.

Ashton Sanders

Post to Twitter Post to Plurk Post to Yahoo Buzz Post to Delicious Post to Digg Post to Ping.fm Post to Reddit Post to StumbleUpon

Tags: broken, gallery, gallery images, JQuery, not working, Thickbox,