Jquery 如何在div中使用BigVideo.js？

我试图将BigVideo.js包含到一个单独的div（比如英雄单元）中，但它继续接管身体背景。我正在使用BigVideo.js主页上的示例代码：

 <script type="text/javascript">
     var BV;
     $(function() {
     // initialize BigVideo
     BV = new $.BigVideo();
     BV.init();
     BV.show('http://video-js.zencoder.com/oceans-clip.mp4',{ambient:true});
});
 </script>

var BV；
$（函数（）{
//初始化大视频
BV=新的$.BigVideo（）；
BV.init（）；
BV.show（'http://video-js.zencoder.com/oceans-clip.mp4“，{ambient:true}）；
});

我试过这样做：

  <script type="text/javascript">
   var BV;
   $(function() {
     // initialize BigVideo
     BV = new $.BigVideo({
    container: $('video-wrap')
     });
     BV.init();
     BV.show('http://video-js.zencoder.com/oceans-clip.mp4',{ambient:true});
 });
  </script>

var BV；
$（函数（）{
//初始化大视频
BV=新的$.BigVideo({
容器：$（'video-wrap'）
});
BV.init（）；
BV.show（'http://video-js.zencoder.com/oceans-clip.mp4“，{ambient:true}）；
});

您需要正确指定BigVideo对象的容器（我不确定这是否是打字错误，但似乎一切正常）

ID

BV = new $.BigVideo({container: $('#video-wrap')});

课程

BV = new $.BigVideo({container: $('.video-wrap')});

在创建对象时，它设置为默认主体（BigVideo代码）：

然后使用

$.extend（）

---

上面的答案只是部分回答了这个问题。您应该更改或覆盖bigvideo.CSS中“#big video wrap”的CSS。将“固定”更改为“绝对”，视频将仅在其容器中可见

来自

#big-video-wrap {
  overflow: hidden;
  position: fixed;
  height: 100%;
  width: 100%;
  top: 0;
  left: 0;
}

至

#big-video-wrap {
  overflow: hidden;
  position: absolute;
  height: 100%;
  width: 100%;
  top: 0;
  left: 0;
}

---

主页上的主标题“大背景视频的jQuery插件”向我暗示你选择了错误的插件。试试这里的‎ insteadIt应该可以正常工作，只需指定什么是视频包装id或类。但是是的，你可以为你的视频指定一个容器，插件所需的所有DOM对象都将附加到这个容器中！谢谢你的回答，这真的很方便。

#big-video-wrap {
  overflow: hidden;
  position: fixed;
  height: 100%;
  width: 100%;
  top: 0;
  left: 0;
}

#big-video-wrap {
  overflow: hidden;
  position: absolute;
  height: 100%;
  width: 100%;
  top: 0;
  left: 0;
}