如何将 div 放在 jwplayer5 视频上？答案

【问题标题】：how is it possible to put a div over a jwplayer5 video?如何将 div 放在 jwplayer5 视频上？
【发布时间】：2013-04-24 12:55:06
【问题描述】：

问题在于，在 IE 上，视频 jwplayer5 会覆盖所有内容，我的目标是用户避免点击视频，以防止播放/暂停效果。有人建议我在视频上放一个 div，我做到了，但在 Internet Explorer（我正在检查 9）上不起作用。

任何已知的工作建议？

这是我的视频：

var video1 = jwplayer('vid1').setup({
            'flashplayer': 'html/js/jwplayer5/player.swf',
            'id': 'playerVid1',
            'width': VIDPLAYER_CTRL.BIGVIDEO_WIDTH,
            'height': VIDPLAYER_CTRL.BIGVIDEO_HEIGHT,
            'file': VIDPLAYER_MODEL.MAIN_VIDEO['path'],
            'provider': 'http',
            'startparam': 'start',
            'controlbar': 'bottom',
            'image': VIDPLAYER_MODEL.MAIN_VIDEO['path_img'],
            wmode: 'transparent',
            'skin': 'html/js/jwplayer5/videoSkin/videoSkin.xml'
});

这是我的视频所在的 div：

<div id="area1" class="aree">
        <div id="vid1_cover1" class="cover1big"></div>
        <div id="vid1_cover2" class="cover2big"></div>
        <div id="vid1"></div>
</div>

这是在视频上创建覆盖 div 的 css：

  div.cover1big{
     background-color: transparent;
     position: absolute;
     width: 601px;
     height: 335px;
     top:0px;
     left:0px;
     z-index: 999;
  }
  div.cover2big{
     background-color: transparent;
     position: absolute;
     width: 576px;
     height: 26px;
     top:335px;
     left:25px;
     z-index: 999;
  }

【问题讨论】：

当您说它在 IE 中不起作用时，您的透明 DIV 元素是否没有出现在视频上方，或者它们只是没有停止对视频的“点击”？
div 是透明的。问题是他们不会停止对 jwplayer 视频的点击（播放或暂停）
我需要两个 div，因为我对视频有一些操作的皮肤，然后我需要覆盖视频的其余部分，因为我不希望用户点击暂停或播放在视频上。
你在设置播放器的z-index吗？ #playerVid1 {z-index: 0} 另外，wmode 应该是刻度吗？ 'wmode' 我不确定 jwplayer 有多严格。
将 z-index 设置为零。 wmode 在刻度中是什么意思？

标签： javascript overlay jwplayer wmode

【解决方案1】：

我会使用 JW5 JS 插件 SDK 来放置 DIV。

http://www.longtailvideo.com/support/jw5/31166/building-javascript-plugins

这里有一个 hello world 示例，它在播放器上创建一个 div，它可以在 Flash 和 HTML5 模式下工作。

【讨论】：

我还有一个问题，是否可以将整个视频都放在控制栏上？我是说，用皮肤？
也许可以，但这会更难。我会先尝试复制我们的示例 hello world 插件。 ;-)
我测试了你的链接，它可以工作（就像之前采用的覆盖解决方案一样），但它仍然不能在 Internet Explorer 上工作，这是否正常？我正在使用 jwplayer 5.7.1864
需要按照我们的正常支持路线向我们发送链接。
有 jwplayer 5.8 的链接吗？我将进行最后一次测试，谢谢