在微信上播放网页视频(ios手机),会自动全屏去播放。百度上的解释是给video标签添加playsinline 和webkit-playsinline,去阻止自动全屏,我试了确实播放时不会自动全屏了,但是再点全屏按钮,视频再也没法全屏了。
1. 我尝试监听x5的全屏事件,去根据是否全屏移除和添加playsinline,发现没触发全屏事件
2.尝试监听全屏按钮,去移除playsinline,发现确实移除掉了,但是视频依然无法全屏,还需要再点一下全屏按钮,才能全屏,那么我直接在监听全屏按钮的同时,再去调用requestFullscreen让视频全屏,发现来回点两次后,页面就卡死了...
1. 我尝试监听x5的全屏事件,去根据是否全屏移除和添加playsinline,发现没触发全屏事件
2.尝试监听全屏按钮,去移除playsinline,发现确实移除掉了,但是视频依然无法全屏,还需要再点一下全屏按钮,才能全屏,那么我直接在监听全屏按钮的同时,再去调用requestFullscreen让视频全屏,发现来回点两次后,页面就卡死了...
window.addEventListener('click', function(e) {
var target = e.target;
for(; target && target !== document; target = target.parentNode) {
if(target.tagName == 'BUTTON') {
if(~target.getAttribute('class').indexOf('vjs-fullscreen-control')){
e.preventDefault();
e.stopPropagation();
return false;
}
}}
}, true);.rotates{
transform: rotate(-90deg) translateX(-100%);
-webkit-transform: rotate(-90deg) translateX(-100%);
transform-origin: 0 0;
-webkit-transform-origin: 0 0;
}