小编Hec*_*tor的帖子

图像和视频滑块自动播放

我使用 bxslider 在滑块上显示图像和视频,我需要滑块每 5 秒显示一次图像,但是当视频出现时,视频会自动播放直到结束。然后,显示下一张幻灯片。所有这些都必须在一个循环中。

我卡住了,这不能正常工作。这是我的问题:

1.- 如果我将 bxslider "auto=true" 设置为从一个滑块更改为另一个滑块,它会在播放视频时执行此操作。

2.- 如果我禁用“自动”属性,第一个视频会播放到最后,然后切换到下一个滑块,但下一个视频不会播放。取而代之的是,第一个视频再次播放。

3.- 如果没有插件,这样做会很棒,因为在解决这个问题后,我需要添加一些 PHP 来使内容变得简单。

这是代码:

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

<link href="css/videos.css" rel="stylesheet" />   
<link href="css/jquery.bxslider.css"  rel="stylesheet"/>
<script src="js/jquery.min.js" type="text/javascript"></script>
<script src="js/jquery.bxslider.min.js" type="text/javascript"></script>
<script src="js/jquery.fitvids.js" type="text/javascript"></script>

</head>

<body>
 <ul class="bx" >
 <li data-idx="0">
     <video preload=""   class="video-bg vid" id="vid0" >
            <source src="video/01.mp4" type="video/mp4">
     </video>
  </li>
  <li data-idx="1">
  <img src="video/slider1.jpg">
  </li>
  <li data-idx="2">
     <video preload=""   class="video-bg vid" id="vid1" >
        <source src="video/02.mp4" type="video/mp4">
     </video>
  </li>
 </ul>

 <script>

     var vid0= document.getElementById("vid0"); …
Run Code Online (Sandbox Code Playgroud)

javascript video jquery slider autoplay

3
推荐指数
1
解决办法
1万
查看次数

标签 统计

autoplay ×1

javascript ×1

jquery ×1

slider ×1

video ×1