微信浏览器video 全屏播放

Question

在微信浏览器上, 使用video标签，播放时如何禁止自动全屏。要的是内联播放的效果。

参考：好像微信公众号文章里面的视频可以不全屏播放，如何做到的，如：http://mp.weixin.qq.com/s/13G...

Answer 1

X5禁止自动全屏这个事，属于世界性难题吧……不信你可以翻翻x5论坛，再看看辣个“腾讯浏览服务前端开发”群，天天有人问（大概1小时前还有问的……），但是除了一句“腾讯白名单”，没有其它解。

公众号里那个应该是调的是腾讯视频开放平台的接口，不介意打Logo和贴片广告的话就可以用，视频传到腾讯的视频平台上就行，文档

---

稍微补充点资料：

Answer 2

<video -webkit-playsinline></video>

Answer 3

亲测！设置-webkit-playsinline是必要的，但是还有个更重要的就是需要微信将你的页面的URL添加到他们的白名单里面， 这样在播放的时候就可以不全屏了。所以要不你能将你的页面丢在指定的白名单域名下，要不你可能需要联系微信的服务人员

Answer 4

公众号里使用的是腾讯视频，所以可以做到，你自己的视频无法解决，稍微好一点的方案是添加x5-video-player-type="h5" x5-video-player-fullscreen="false"
至于-webkit-playsinline和playsinline是给iPhone用的，Android中不起作用

Answer 5

1、将视频先传到腾讯视频网上，类似于这种https://v.qq.com/x/page/z0355...；
2、找到左下角有个分享按钮，鼠标放上去就有三个功能复制flash地址，复制html代码和复制通用代码，选复制通用代码；
3、将代码粘贴到html中就行了。iframe标签中视频宽高可以自己调整。

http://919.ofun.morewifi.com/...这个链接你用微信打开看看，我试了不是全屏的吧。

Answer 6

遇到类似的播放的问题，放弃了。

Answer 7

使用canvas渲染画布，公众号：webs100 回复：demo可下载源代码
X5内核浏览器video自动全屏解决办法

Answer 8

还要看下视频文件，保证是立体声

Answer 9

还有一种方法，就是初始化的时候就把video标签设置为全屏，这样点击的时候相当于小屏播放了

Answer 10

<div
    webkit-playsinline="true"
    x5-playsinline="true"
    playsinline="true">
  <video
   id="test_video"
   src="地址"
      controls="controls"
      webkit-playsinline="true"
      x5-playsinline="true"
      playsinline="true"
      autoplay>
  </video>
 </div>