video是移动端无法自动播放以及自动弹出解决方法
2021/7/13 23:39:27
本文主要是介绍video是移动端无法自动播放以及自动弹出解决方法,对大家解决编程问题具有一定的参考价值,需要的程序猿们随着小编来一起学习吧!
视频在 safri 页面不能自动播放的原因:
因为ios中明确的指出等待用户的交互动作后才能播放video,也就是说没有得到用户的action就播放的话会被safri拦截
解决方法如下:
因为这个是微信的链接,需要在微信上点开进入他的浏览器,这里需要一个插件
<script src="http://res.wx.qq.com/open/js/jweixin-1.2.0.js" type="text/javascript" charset="utf-8"></script>
然后我们以id为video的video标签来写
document.addEventListener("WeixinJSBridgeReady",function() { document.getElementById('video').play(); }, false);
上面代码说的是对微信准备就绪时的一个内置API进行监听来触发事件,让这个video标签进行play()播放。
视频在苹果手机内嵌播放,不会弹出视频窗口
<video name="media" preload="none" x5-playsinline="true" playsinline="true" webkit-playsinline="true" poster="./static/img/delivery-slam2-lg.jpg" muted="muted" src="https://...mp4" class="video-sm"> <source data-layzr-src="https://...mp4" type="video/mp4"> </video>
其中 核心代码
x5-playsinline="true" playsinline="true" webkit-playsinline="true"
这篇关于video是移动端无法自动播放以及自动弹出解决方法的文章就介绍到这儿,希望我们推荐的文章对大家有所帮助,也希望大家多多支持为之网!
- 2024-11-16Maven资料入门指南
- 2024-11-16Maven资料入门教程
- 2024-11-16MyBatis Plus资料:新手入门教程与实践指南
- 2024-11-16MyBatis-Plus资料入门教程:快速上手指南
- 2024-11-16Mybatis资料入门教程:新手必看指南
- 2024-11-16MyBatis资料详解:新手入门与初级实战指南
- 2024-11-16MyBatisPlus资料:初学者入门指南与实用教程
- 2024-11-16MybatisPlus资料详解:初学者入门指南
- 2024-11-16MyBatisX资料:新手入门与初级教程
- 2024-11-16RESTful接口资料详解:新手入门指南