Thickbox scrolling in IE hot-fix

Thickbox is an open source javascript tool for making wow-yeah graphical overlays that seem to be all the rage these days. Like most dhtml/css stuff, however, cross-browser implementations are a real challenge (pain in the arse). So the design studio calls and says ”sh*t don’t work in IE”. Yet, another chapter in the css “it’s fuct in IE” book.

Went to google groups and found a patch for IE 6, but nunka for IE 7. After a little more research, I came up with this hot-fix that works for both IE 6 & 7. Simply replace the function “tb_position” in thickbox.js with this:

function tb_position() { // hot fixed for microsuck internet exploiter
jQuery("#TB_window").css({marginLeft: '-' + parseInt((TB_WIDTH /2),
10) + 'px', width: TB_WIDTH + 'px'});
var dtop=parseInt((TB_HEIGHT / 2),10);
var scrolledDown=0;
if(jQuery.browser.msie){//ie hax
if(document.body != null){
scrolledDown=document.body.scrollTop;
}
else if(document.documentElement != null){
scrolledDown = document.documentElement.scrollTop; //ie7
}
}
if(scrolledDown){
jQuery("#TB_window").css({marginTop: '+' + scrolledDown + 'px'});
}
else{
jQuery("#TB_window").css({marginTop: '-' + dtop + 'px'});
}
}

Posted in jQuery | 7 Comments