在加载时停止自动播放视频 - BXSlider

时间:2016-03-07 17:57:29

标签: javascript jquery html5 bxslider

我在其中一个网站上使用bxslider作为简单的视频滑块。但是滑块中的所有视频都会在加载时开始播放。我必须禁用它。

HTML:

  <ul class="bxslider">
    <?php 
    foreach($vdos->result() as $vdo){
      ?>
      <li>
        <iframe src="<?php echo asset_url().'vdo/'.$vdo->vdoPath; ?>" width="100%" height="100%" frameborder="0" webkitAllowFullScreen mozallowfullscreen allowFullScreen></iframe>
      </li>
      <?php
    }
    ?>
  </ul>

JS:

$(document).ready(function(){
    slider = $('.bxslider').bxSlider({
      video: true,
      useCSS: false,
      auto: false,
      controls: false,
      onSliderLoad: function(){
       slider.stopAuto(true);
     }
   });

我已经坚持了一段时间了。任何指导都会非常有用。

我厌倦了提出的解决方案

bxslider stopping video element autoplay

对我来说没有用。 谢谢。

P.S:我正在测试.mp4格式

1 个答案:

答案 0 :(得分:1)

问题是iframe

<ul class="bxslider" >
  <li>
     <video preload="" loop="" class="video-bg">
            <source src="video/sample.mp4" type="video/mp4">
     </video>
  </li>
  <li>
     <video preload="" loop="" class="video-bg">
            <source src="video/sample.mp4" type="video/mp4">
     </video>
  </li>
</ul>



$('.bxslider').bxSlider({
    video: true,
    useCSS: false,
    onSliderLoad:function(currentIndex){
        $("video").trigger("play");
    },
});
相关问题