css - 为什么 noverblaster 视频播放器总是在其他元素之上

Question

我正在寻找一个免费的视频播放器放在网站上，然后找到了 nonverblaster ，但我不能将它设置在其他元素后面 - 属性 z-index 不适用于它，你知道强制他合作的任何解决方案吗？ 我的一段简单的代码:

<div style="position:relative;">
    <div id="main-video" style="position:absolute;top:0px;left:0px;z-index:10;">
        To watch this video, you need the latest <a href="http://www.adobe.com/shockwave/download/download.cgi?P1_Prod_Version=ShockwaveFlash" target="_blank">Flash-Player</a> and active javascript in your browser.
    </div>

    <img src="media/nice-flowers.jpg" alt="alt" style="position:absolute;left:0px;top:400px;z-index:100" />
</div>


<script type="text/javascript">
    var flashvars = {};
        flashvars.mediaURL = "../../uploads/files/movie.mp4";
        flashvars.teaserURL = "uploads/files/start_frame.jpg";
        flashvars.allowSmoothing = "true";
        flashvars.autoPlay = "false";
        flashvars.buffer = "6";
        flashvars.showTimecode = "true";
        flashvars.loop = "false";
        flashvars.controlColor = "0x3fd2a3";
        flashvars.controlBackColor = "0x000000";
        flashvars.scaleIfFullScreen = "true";
        flashvars.showScalingButton = "true";
        flashvars.defaultVolume = "100";
        flashvars.crop = "false";
        flashvars.onClick = "toggleFullScreen";

    var params = {};
        params.menu = "false";
        params.allowFullScreen = "true";
        params.allowScriptAccess = "always"

    var attributes = {};
        attributes.id = "nonverblaster";
        attributes.bgcolor = "#000000"
    function embedSWF()
    {
        swfobject.embedSWF("js/video_player/video_player.swf", "main-video", "762", "429", "9", "js/video_player/expressinstall.swf", flashvars, params, attributes);
    }
    embedSWF();
</script>

Answer 1

您需要将wmode设置为opaque。

因此，在您的脚本中，添加一行 params.wmode = "opaque";