I noticed that in IE6, presumably because it doesn't support position:fixed, there is no translucent overlay under the lightbox.

By amending the CSS for the fbOverlay rule you can fix this. Note that the underscores before position and height rules cause those rules only to be read by IE6. Other browsers (correctly) skip over them.

#fbOverlay
{
/* underscores denote special IE6 nonsense */
position: fixed;
_position:absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
_height: expression(document.body.scrollHeight);
z-index: 99994;
}

Hi London,
Thanks for this. This is the second report I've received of IE6 overlay not displaying. I'm puzzled by this because I can't reproduce it. I would REALLY REALLY like it if someone could post a URL to a page where this occurs so I could look at the details.

Your solution is good as far as it goes. The setting of position:absolute for ie6 is done in the floatbox.js code, and there's additional code required to handle resizing the ie6 overlay when the browser is scrolled or resized. That code section looks like this:

if (this.ieOld) {
	this.hideElements('select');
	this.fbOverlay.style.position = 'absolute';
	this.stretchOverlay()();
	this.win.attachEvent('onresize', this.stretchOverlay());
	this.win.attachEvent('onscroll', this.stretchOverlay());
}

I'd really like to see why that code is not firing for you.

I have a theory. Floatbox uses conditional compilation to browser detect IE.

/*@cc_on
} else if (true) {
	this.ie = true;
	this.ieOld = @_jscript_version < 5.7;  // less than v7
	this.ie8b2 = window.postMessage && navigator.appMinorVersion === 'beta 2';  // ie8beta detect
@*/

Is it possible you have stripped that code out of the .js file, either directly or by running the code through a compresser that is not conditional compilation aware? (This snippet is from v3.11. I think you're using an older version).

Did I mention that I'd REALLY REALLY like to see an online page that exhibits this misbehaviour???

Hi,

I noticed it on a page I have in development which is using 2.46, but actually your demo page, which I presume is using 3.11 exhibited the same issue.

Your theory is probably right. - ieOld is not set.
I don't think you can rely on the Jscript version to identify IE6, because I understand that it was updated by the Windows auto-update process. Most IE6 installs will be on 5.7 now.

The one I personally tested it on was a clean freshly installed virtual machine with Windows XP service pack 3, and no updates after the install.

Yup, you're spot on. Service pack 3 changes the IE6 javascript version.

This is so unfortunate - and irritating. IE5 reports jscript 5.5, IE6 reports 5.6 , IE7 5.7 and IE8 5.8. What could be cleaner? I went specifically with the jscript version because I expected it to be more immutable than the user agent string. As you say, SP3 makes IE6 report jscript version 5.7. Oh well, bad luck for me, no point whinging.

I will change the ieOld detect to

this.ieOld = parseInt(navigator.userAgent.substr(navigator.userAgent.indexOf('MSIE') + 5), 10) < 7;

Unfortunately, I have to ask every floatbox user to either download an updated version or patch their floatbox.js copy with the above line. I'm not happy about this. I'll update both v3.11 and v2.46. The fixed versions will be up by mid-Saturday.

Thanks very much for your help with this.