You want to place a div over a Flash movie, but that doesn’t work, even with z-index or by changing their order in the HTML code? Add the wmode=transparant property like in the example below.
<script language="JavaScript" type="text/javascript"> if (AC_FL_RunContent == 0) { alert("This page requires AC_RunActiveContent.js."); } else { AC_FL_RunContent( 'codebase', 'http:…','width','515','height','484','id', 'example','align','middle','src','example', 'quality','high','bgcolor','#ffffff','name', 'example','allowscriptaccess','sameDomain', 'allowfullscreen','false','pluginspage', 'http…','movie','example-homepage', 'wmode','transparent' ); //end AC code}</script> <noscript> <object width="515" height="484" id="example" align="middle"> <param name="wmode" value="transparent" /> <param name="allowScriptAccess" value="sameDomain" /> <param name="allowFullScreen" value="false" /> <param name="movie" value="example.swf" /> <param name="quality" value="high" /> <param name="bgcolor" value="#ffffff" /> <embed src="example.swf" quality="high" bgcolor="#ffffff" width="515" height="484" name="example-homepage" align="middle" allowscriptaccess="sameDomain" allowfullscreen="false" type="application/x-shockwave-flash" pluginspage="http:…" wmode="transparent" /> </embed> </object> </noscript>
- If you only use the object tag, this still works if you adjust that part.
- This problem doesn’t occour in, for example OS X 10.7 / Safari 5, but it does in Windows 7 / Internet Explorer 8.