overlay html over flash? [duplicate]

This question already has answers here: Closed 11 years ago.

Possible Duplicate:

Div Z-Index issue with Flash movie

Is it possible to overlay a piece of html over a flash animation given this context: -flash conte开发者_如何转开发nts underneath is NOT clickable -html will contain js link clicking which will open an iframe popup similar to: http://www.dynamic-tools.net/toolbox/popUp/

thanks!

---

It is not standards-compliant, but try adding wmode="transparent" to the embed tag as follows:

<object> 
    <!-- ... -->
    <param name="wmode" value="transparent"/> 
    <embed src="flash_file.swf" wmode="transparent"></embed> 
    <!-- ... -->
</object>

With these parameters set, the flash movie should obey CSS z-index settings.

---

Basically Mike Koval's answer will do the job, that is setting wmode="transparent". All other HTML/CSS/JS things will remain the same from your own link.

Full embedding code HTML version (by swfObject's generator) will be:

<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="800" height="600" id="myFlashContent">
        <param name="movie" value="path/to/flash.swf" />
        <param name="wmode" value="transparent" />
        <!--[if !IE]>-->
        <object type="application/x-shockwave-flash" data="path/to/flash.swf" width="800" height="600">
            <param name="wmode" value="transparent" />
        <!--<![endif]-->
            <a href="http://www.adobe.com/go/getflashplayer">
                <img src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif" alt="Get Adobe Flash player" />
            </a>
        <!--[if !IE]>-->
        </object>
        <!--<![endif]-->
</object>

It will be always better to use swfObject in JS, something like:

var flashvars = {};
var params = {};
params.wmode = "transparent";
var attributes = {};
swfobject.embedSWF("path/to/flash.swf", "id-of-the-div-the-flash-will-go", "800", "600", "9.0.0", false, flashvars, params, attributes);