BigVideo:如何在视频下隐藏控制选项

时间:2015-02-24 10:34:02

标签: javascript jquery video html5-video video.js

我目前正在使用BigVideo.js来显示我的视频作为背景;但是,我的视频下有多个选择表单。

他们来自vjs-tracksettings课程,例如' window-color vjs-tracksetting'。不是所有的vjs-tracksetting都需要关闭,因为它也包括视频。

我有预感要关闭它,我需要关闭某些组件选项(https://github.com/videojs/video.js/blob/master/docs/guides/options.md),但我不知道如何通过BigVideo来实现。另外,我的预感是它在控制栏(https://github.com/videojs/video.js/blob/master/docs/guides/components.md)内。

或者它与textTrackDisplay有关。

任何光都会有帮助!!我已经坚持了一段时间。 (另外,我把所有的js文件放在标题中。我知道你应该把它放在body标签的末尾,但由于某种原因,它在那里没有用。)

编辑:我已在评论中附上了一张照片的图片

我在这里附上了我的HTML。如果需要任何css / js文件,请告诉我们!

  <!DOCTYPE html>
  <html lang="en">
  <head>


  <!-- Include src files -->
     <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
      <script>window.jQuery || document.write('<script src="bower_components/jquery/dist/jquery.min.js"><\/script>')</script>
      <script src="bower_components/jquery-ui/jquery-ui.min.js"></script>
      <script src="bower_components/imagesloaded/imagesloaded.pkgd.min.js"></script>
  <!-- BigVideo -->    
  <script src="bower_components/video.js/dist/video-js/video.js"></script>


      <script src="bower_components/BigVideo.js/css/bigvideo.css"></script>
  <script src="bower_components/BigVideo.js/lib/bigvideo.js"></script>



    <!-- Basic Page Needs
    –––––––––––––––––––––––––––––––––––––––––––––––––– -->
    <meta charset="utf-8">
    <title>Page Title</title>
    <meta name="description" content="">
    <meta name="author" content="">

    <!-- Mobile Specific Metas
    –––––––––––––––––––––––––––––––––––––––––––––––––– -->
    <meta name="viewport" content="width=device-width, initial-scale=1">


    <!-- CSS
    –––––––––––––––––––––––––––––––––––––––––––––––––– -->
    <link rel="stylesheet" href="css/normalize.css">
    <link rel="stylesheet" href="css/skeleton.css">

    <!-- Favicon
    –––––––––––––––––––––––––––––––––––––––––––––––––– -->
    <link rel="icon" type="image/png" href="images/favicon.png">
  </head>
  <body>

    <!-- Primary Page Layout
    –––––––––––––––––––––––––––––––––––––––––––––––––– -->
    <div class="container">
        <div id="hello" >

          <script type="text/javascript">
          $(function() {
              var options = {
                controls: false,
                doLoop: true,
                useFlashForFirefox: false,
                poster: "initialVid.png",
              }
              var BV = new $.BigVideo(options);
              BV.init();
              BV.show([
              { type: "video/webm", src: "forest_ski.webm"},
              { type: "video/mp4", src: "forest_ski.mp4"}
              ]);
            });
          </script>
      </div>
    </div>

  <!-- End Document
    –––––––––––––––––––––––––––––––––––––––––––––––––– -->
  </body>
  </html>

1 个答案:

答案 0 :(得分:1)

没关系,我已经解决了这个问题。因为我并没有将big.css称为css文件。如果有人遇到过这个,这就是你的问题!