时间戳

首页 > 解决方案 > 视频自动播放有时有效有时无效

javascript - 视频自动播放有时有效有时无效

问题描述

我在我的页面上使用视频作为横幅。当有人因为数据问题使用手机时，我希望它停止播放。尝试使用 jquery 检查窗口大小并在其宽度低于 600 像素时停止。问题是，有时视频开始在电脑上自动播放，但如果我刷新页面，它就会停止。我正在使用 js+jquery，试图添加到结束正文标记的正上方以及标题中。我在某处读到浏览器阻止在手机上自动播放，但不确定是否属实。我也很乐意听到一些关于它的答案。这是我的代码：

<video class="video" id="video" loop="loop" muted="muted" preload="auto">
<source src="https://www.lacity.org/sites/g/files/wph1221/f/EchoPark_1920x800_loop.mp4" type="video/mp4">
Böngészője nem támogatja a  a HTML5 videót</video>

<script
  src="https://code.jquery.com/jquery-3.4.1.min.js"
  integrity="sha256-CSXorXvZcTkaix6Yvo6HppcZGetbYMGWSFlBw8HfCJo="
  crossorigin="anonymous"></script>
<script>
$(function() {
  var screenWidth = $(window).width();
  if (screenWidth >= 600) {
    $('#video').attr('autoplay', 'autoplay');
  }
});
</script>

标签： javascripthtmljquery

解决方案

Please try this code i hope help you.

<script
  src="https://code.jquery.com/jquery-3.4.1.min.js"
  integrity="sha256-CSXorXvZcTkaix6Yvo6HppcZGetbYMGWSFlBw8HfCJo="
  crossorigin="anonymous"></script>
<script>
$(function() {
  var screenWidth = $(window).width();
  if (screenWidth >= 600) {
    $('#video').play();
  }
});
</script>

推荐阅读