如何禁止 iPhone Safari 視頻自動全屏?

<video id="post" autoplay loop preload="auto">
<source src="foo.mp4" type="video/mp4">
</video>

由JavaScript控制播放 不使用video標籤controls屬性
iPhone safari 點擊視頻會彈出播放器進行全屏播放

如何不全屏 使視頻在網頁中播放?


iPhone Safari 中播放視頻只能全屏,所以這個問題是沒有答案的。
-------------------------------------
以下爲拓展,
在iOS APP中使用網頁視頻,是可以禁止全屏播放的,方法如下:
  1. 前端將video標籤加入屬性 webkit-playsinline,如:<video id="player" width="480" height="320" webkit-playsinline>;
  2. Obj-C中,添加配置:webview.allowsInlineMediaPlayback = YES;
這樣web視頻就可以嵌入播放了,方案參考:
HTML5 inline video on iPhone vs iPad/Browser
鏈接:https://www.zhihu.com/question/21094425/answer/56014727


iOS10 原生支持啦~ video 元素上添加 playsinline 特性即可。
New <video> Policies for iOS

iOS10 以下(親測 iOS9)可以藉助這個JS庫:
GitHub - bfred-it/iphone-inline-video: Make videos playable inline on the iPhone (prevents automatic fullscreen)
缺點是不支持多視頻源,用的時候 video 元素上不能寫 controls 特性
鏈接:https://www.zhihu.com/question/21094425/answer/127476949


發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章