关于video标签loop自动循环到一定时间就自动停止的问题

本文探讨了浏览器优化导致的视频循环播放失败问题,提出使用JS监听ended事件来确保视频连续循环,避免因loop属性和文件格式顺序不当引起的播放中断。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

个人猜测是因为浏览器的优化问题,当视频自动循环到一定时间,浏览器就会给优化掉

然后选择用js,监听ended事件

<div class="bgVideo">
       <video autoplay muted id="video" >
             <source src="xxx.mp4" type="video/mp4">
             <source src="xxx.webm" type="video/webm">
       </video>
 </div>

$('#video').on('ended', function () {
          var _this = this;
          _this.play();
      });

这里有两个踩坑点:
1,video不能带loop属性,不然不能监听到end事件
2,mp4格式的视频一定要在webm的格式之前,不然谷歌浏览器还是会停止播放

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值