代码之家  ›  专栏  ›  技术社区  ›  Ant Arni

视频“自动播放”有时只会成功

  •  0
  • Ant Arni  · 技术社区  · 5 年前

    我的目标是有一个视频幻灯片,自动重复以及启动自动。不幸的是,视频有时只会自动播放:根据我的实验,如果页面已经加载,或者页面是从网站的另一部分导航到的,那么视频很可能会在重新加载页面时自动播放。因为这个视频是要在我的主页上运行的,所以这不是一个真正的选择。这可能是一个与浏览器有关的问题,因为我不认为有任何bug会导致这个问题,我使用的是最新版本的chrome。

    var videos = ["6", "5", "3", "8", "7", "2"];
    
    function nextVideo() {
        var current = videoSource.getAttribute("src");
        current = current.slice(9, -4);
        var position = videos.indexOf(current);
        var newPos;
        if (position == videos.length - 1) {
            newPos = videos[0];
        } else {
            newPos = videos[position + 1];
        }
    
        videoSource.setAttribute("src", "videos/No" + newPos + ".mp4");
        videoId.currentTime = 0;
        videoId.load();
        videoId.play();
    }
    <video autoplay id="videoId" onended="nextVideo()">
        <source src="videos/No6.mp4" id="videoSrc">
    </video>
    2 回复  |  直到 5 年前
        1
  •  2
  •   Krishna    5 年前
    <video width="320" height="240" controls autoplay>
      <source src="your_video_name.mp4" type="video/mp4">
      Your browser does not support the video tag.
    </video>
    

    你可以看到 视频 link

        2
  •  0
  •   brooksrelyt Ozal Zarbaliyev    5 年前

    muted 对于某些只在静音时自动播放的浏览器:

    <video autoplay muted id="videoId" onended="nextVideo()">
        <source src="https://app.coverr.co/s3/mp4/Mock-up.mp4" id="videoSrc">
    </video>
    

    https://codepen.io/brooksrelyt/pen/WPrMrG