Web

admin管理员组

文章数量:1794759

Web

实例代码:

<!-- 用一个div容器 来包裹视频 --><div id="myVideo" style="position:absolute;z-index:9999;width:100%; height:100%;"> <video onclick="play();"  muted="muted" id="videoplay" autoplay="autoplay" preload="auto"  style="width:100%; height:100%; object-fit: fill">     <source src="" type="video/mp4">    </video>  </div>      <!-- 自动播放视频js代码开始 --><script>  var ua = navigator.userAgent;var ipad = ua.match(/(iPad).*OS\s([\d_]+)/),isIphone =!ipad && ua.match(/(iPhone\sOS)\s([\d_]+)/),isAndroid = ua.match(/(Android)\s+([\d.]+)/),isMobile = isIphone || isAndroid;if(isMobile){document.getElementById("videoplay").src= "video/c04.mp4";}else{document.getElementById("videoplay").src= "video/c04.mp4";}var md=document.getElementsByTagName("video")[0];md.addEventListener("ended",function(){var box = document.getElementById("myVideo");box.parentNode.removeChild(myVideo);});</script><script>document.getElementById('videoplay').play(); document.addEventListener("WeixinJSBridgeReady", function () {  document.getElementById('videoplay').play();  }, false); </script><!-- 自动播放视频js代码结束-->

解决封面动画没有 自动播放的问题:

网上说 加 autoplay="autoplay" preload="auto" 两个属性就行了 

但是经过本人 测试并没有效果

注意:还需要加 一个非常关键的属性 --->   muted="muted"

<video onclick="play();"  muted="muted" id="videoplay" autoplay="autoplay" preload="auto"  style="width:100%; height:100%; object-fit: fill">     <source src="" type="video/mp4">    </video>  

如果开场视频 加载较慢 可以使用 格式工厂 压缩视频

Mac端可以使用 HandBrake 进行压缩

参考过的一篇文章:

本文标签： web