微信浏览器视频自动播放

这篇文章主要介绍了解决手机微信浏览器视频自动播放和默认全屏问题(示例代码)以及相关的经验技巧，文章约1077字，浏览量435，点赞数6，值得推荐！

1.早期因为带宽和流量的因素，移动端浏览器禁止视频自动播放，现在现在流量便宜了、手机硬件越来越好了，部分可支持了
2.在移动端浏览器， video 在用户点击播放或者通过API video.play() 触发播放时，会强制以全屏置顶的形式进行播放，设计的初衷可能是因为全屏能提供更好的用户体验

<video  controls="controls" src="" id="ckplayer_a1" x5-video-player-type="h5" preload="metadata" playsinline="true"webkit-playsinline="true"  x-webkit-airplay="true"x5-video-orientation="portraint" x5-video-player-fullscreen="true">
</video>

playsinline="true" webkit-playsinline="true 解决ios自动播放全屏问题

x5-video-player-type="h5" x5-video-player-fullscreen="true" 解决安卓同层级播放

3.ios微信下通过 WeixinJSBridgeReady 事件进行自动播放

document.addEventListener(‘WeixinJSBridgeReady‘,function() {var video = document.getElementById("ckplayer_a1");video.play();},false
);

安卓可以尝试监听touchstart事件，用户触摸屏幕后自动播放

document.addEventListener(‘touchstart‘, function(){ var video = document.getElementById("ckplayer_a1");video.play();
}, false);

$(function(){
var video=document.getElementById("videoPlay1");
//video.play();//无效

//$(window).scroll(function(){//无效
// video.play();
// });

$('body').click(function(){//有效
video.play();
});

});

以上就是本文的全部内容，希望对大家的学习有所帮助，本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。

微信浏览器视频自动播放相关推荐

解决手机微信浏览器视频自动播放和默认全屏问题
1.早期因为带宽和流量的因素,移动端浏览器禁止视频自动播放,现在现在流量便宜了.手机硬件越来越好了,部分可支持了 2.在移动端浏览器, video 在用户点击播放或者通过API video.play( ...
苹果ios微信浏览器视频自动播放
在微信H5浏览器内遇见视频在安卓手机环境下可以自动播放,苹果手机环境下不能自动播放的问题,下面研究了两种方法供大家参考. 1,引入微信jssdk(测试没有成功) <script src=&quo ...
H5页面在微信浏览器中自动播放视频
H5页面在微信浏览器中自动播放视频安卓和IOS不同 h5在安卓微信浏览器上的视频不能自动播放 h5在iOS微信浏览器上的视频可以自动播放 iOS的实现方案
iOS 微信音视频自动播放原生接口WeixinJSBridge API(一些整理小技巧)
原文链接1:https://www.w3ctech.com/topic/1165 原文链接2:https://www.cnblogs.com/jasonduan/p/5635048.html 做一下整 ...
微信浏览器无法自动播放视频几种解决方式
公司页面设计打开页面需要播放一个过场的MP4视频,在电脑上手机上都没啥事但是在手机微信浏览器里面视频是无法自动播放的. 网上教你的方式无非就是 //引用官方的JS文件 <script src=& ...
微信浏览器背景音乐自动播放
html: <audio style="display:none; height: 0" id="bg-music" preload="auto ...
视频在H5页面在微信浏览器不能自动播放问题
//引用官方的JS文件 <script src="http://res.wx.qq.com/open/js/jweixin-1.0.0.js"></script& ...
微信video视频自动播放
document.addEventListener("WeixinJSBridgeReady",function(){ document.getElementById(" ...
仿抖音视频自动播放html,vue 仿抖音视频列表（兼容微信内置X5浏览器）
制作仿抖音视频列表遇到很多坑,特别是安卓微信内置浏览器,让人脑壳疼,核心代码不多便于理解组件用到了vant 中的swiper滑动组件 h5 原生 video 属性 webkit-playsinl ...
【H5】html5 video 在微信浏览器视频不能自动播放！
html5 video在安卓微信浏览器视频不能自动播放 ! html5 video在安卓微信浏览器视频不能自动播放 ! html5 video在安卓微信浏览器视频不能自动播放 ! 注:重要的事情说三遍 ...

微信浏览器视频自动播放

微信浏览器视频自动播放相关推荐

最新文章

热门文章