thickbox problem in IE 6... (solution)
Although I don't know that this is the correct group to post this in,
I ended up finding the bug in thickbox that caused the plugin div not
to center. This is the e-mail I sent to Cody Lindley...
The thickbox is awesome by the way, but there is a small bug in it
which I'm sure you've heard of. The thickbox does not center on the
screen in some versions of IE 6. By now you've probably figured out
what was wrong with it but just in case you or anyone else have not
I'm sending you the solution that I found.
Apparently the jQuery.browser.version returns an object
that when compared using the usual <, =, >, etc. works fine unless you
have a version such as 6.1.# (I'm assuming this). In your
tb_position() function it checks if the version < 7. In order to get
past this bug I added jQuery.browser.version.number() which is
supposed to return a usable number for comparison. This fixed the
problem for me.
Also a couple of other things if you want to add them :
I'm using the thickbox gallery functionality and was trying to flow
through images of an unknown size. The problem I ran into is that the
thickbox does not have a minimum size and for small images. The
titles and links in the thickbox overflow into the overlay. In order
to fix this I added a couple of lines and two new variables.
At the beginning of the js file I add these:
tb_minWidth = 350; //found this seems to be the best for my gallery
tb_minHeight = 0;
Then where the TB_WIDTH and TB_HEIGHT are set I add these:
TB_WIDTH = ((imageWidth+30>tb_minWidth)?imageWidth + 30:tb_minWidth);
TB_HEIGHT = ((imageHeight+60>tb_minHeight)?imageHeight +
60:tb_minHeight);
This keeps the thickbox looking nice and clean for the most part. From
there I realized that the images aren't centered when the minWidth is
implemented so I added this to the css:
#TB_window img#TB_Image {
display:block;
margin-top: 15px;
margin-bottom: 15px;
margin-left: auto;
margin-right: auto;
border-right: 1px solid #ccc;
border-bottom: 1px solid #ccc;
border-top: 1px solid #666;
border-left: 1px solid #666;
}
Hope these solutions help you in some way but if not I still owe you a
thank you for the thickbox. It works great.
Thanks