Flash overlays thickbox on Internet Explorer

Question

Here's my code:

I've got a flash slideshow on my page. I've used thickbox for login but when someone clicks on the login, the flash overlays thickbox.

I've managed to solve the problem on Firefox, but nothing seems to work on Internet Explorer.

Answer 1

You need to use one of the following attributes in order to get Flash to sit "within" the DOM rather than over it.

wmode=transparent -or- wmode=opaque

Comes with the disadvantage of breaking a number of features.

Answer 2

spender is correct, but he didn't explain it much. wmode is an attribute that gets set in the html when you embed the swf, and it needs to be set to transparent. So if you were using AC_RunActiveContent you'd add "wmode", "transparent" as arguments to the embedding function, or in swfoject you'd add so.addVariable("wmode", "transparent");

Answer 3

LightBox for Videos - CeeBox: jQuery Plugin for Displaying Flash Videos with an Overlay describes a jquery plugin for overlay flash video display.

Answer 4

Hi

I had the same problem with the following flash object:

<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,0,0" width="690" height="400" id="tech" align="middle">
          <param name="allowScriptAccess" value="sameDomain" />
          <param name="movie" value="banner/banner.swf?xml_path=banner/slides.xml" />
          <param name="quality" value="high" />
          <param name="wmode" value="opaque" />
          <embed src="banner/banner.swf?xml_path=banner/slides.xml" quality="high" width="690" height="400" name="tech" align="middle" allowScriptAccess="sameDomain" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer"  />                                                             

        </object> 

Note the line <param name="wmode" value="opaque" /> That's the key to make it work.

Hope it helps you.

Bye

Answer 5

in the thickbox.js file you can use this:

seach for the tb_show function and add this at the end of the "try" before the "catch":

$('object').each(function(){ this.regDisplay=this.style.display; this.style.display='none'; })

and

$('#TB_window object').each(function(){ this.style.display=this.regDisplay; })

search for the tb_remove function, and add this before the return:

$('object').each(function(){ this.style.display=this.regDisplay; })

Answer 6

The answer of Trey works pretty well for all flash items on page.

The code for the tb_remove function

$('object').each(function(){ this.style.display=this.regDisplay; })

should be placed inside

j("#TB_window").fadeOut("fast",function(){
...
});

This way it only appears after the fadeout and not instantly...