Question

我正在使用从http://kenwheeler.github.io/slick/

下载的光滑滑块

我在自动播放中有很多图像正确显示，但是，我也有一个mp4文件，我无法自动播放。这是我的HTML：

<section class="regular slider" style="width: 900px; left: 60px; top: 230px;">
    <div>        
        <video autoplay>
            <source src="http://clips.vorwaerts-gmbh.de/big_buck_bunny.mp4" type="video/mp4">
        </video>
    </div>
    <div>
      <img src="https://placehold.it/350x300?text=2">
    </div>
    <div>
      <img src="https://placehold.it/350x300?text=3">
    </div>
 </section>

这是我的剧本：

<script type="text/javascript">
    $(document).on('ready', function() {
      $(".regular").slick({
        dots: true,
        infinite: true,
        slidesToShow: 1,
        slidesToScroll: 1,
          autoplay: true,
          autoplaySpeed: 2000
      });
     });
  </script>

Answer 1

我引用@AsafDavid。请查看original answer。

中的工作代码示例

是的，可以使用JavaScript完成。当视频幻灯片成为   $ref: '#/definitions/CancelRequest'你必须：
暂停滑块

播放视频

您可以使用currentSlide事件执行此操作：
afterChange

Answer 2

您可以使用 afterChange 回调功能来实现此目的。

$('.your-element').on('afterChange', function(event, slick, currentSlide, nextSlide){
    $('#video')[0].play(); 
});

在光滑滑块内自动播放视频

2 个答案: