最近做一个移动端微信页面项目,在微信页面中有视频播放,但是需要禁止IOS的自动全屏播放(前提必须使用video标签)。
如:

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

在iPhone safari 点击视频会弹出播放器进行全屏播放。

在网上看了看别人给出的答案,引用如下:

可以在 video 标签上加一个 “webkit-playsinline” 属性 ,如下:

<video id="video" width="280" height="140" webkit-playsinline ></video>

我想说这能解决问题吗? 答案当然是不能。。。。

当然在iOS APP中使用网页视频,是可以禁止全屏播放的,方法如下:
前端将video标签加入属性 webkit-playsinline,如:

<video id="player" width="480" height="320" webkit-playsinline>

Obj-C中,添加配置:

webview.allowsInlineMediaPlayback = YES

还有网友这样回答答案:
把视频转码,用ajax去分段请求数据来填充到canvas。

当然如果确实需要退出全屏,可以使用这样的方法,但是毕竟这样没什么必要。

所以最终的结论是:没有办法禁止 iPhone Safari video标签视频自动全屏.

如何禁止 iPhone Safari video标签视频自动全屏?的更多相关文章

  1. video.js 视频自动全屏播放

    1.头部引用脚本 <link href="css/video-js.min.css" rel="stylesheet"> <link href ...

  2. 【html5】 解决 video标签 不自动全屏

    <video controls="controls" poster='' src='' preload="auto" x5-playsinline=&qu ...

  3. 阻止 iPhone 视频自动全屏

    最近一年都在做直播,遭video 全屏的问题困扰了很久.下面将阻止 ios视频自动全屏的办法写出来.添加 playsinline 和 webkit-playsinline="true&quo ...

  4. h5 video 点击自动全屏

    加上如下属性 https://blog.csdn.net/weixin_40974504/article/details/79639478 可阻止自动全屏播放,感谢 https://blog.csdn ...

  5. Video如何不自动全屏播放?

    知乎:微信内置浏览器 如何小窗不全屏播放视频? 目前在微信中只能全屏播放,只有加入腾讯白名单的视频才能小屏播放. 知乎上讨论的解决方案尚未测试,太麻烦了.

  6. ios 安卓 video 取消播放自动全屏 属性

    x-webkit-airplay="true",x5-playsinline="true",webkit-playsinline="true" ...

  7. 【转】Android HTML5 Video视频标签自动播放与自动全屏问题解决

    为了解决 HTML5Video视频标签自动播放与全屏问题,在网上找了很多相关资料,网上也很多关于此问题解决方法,但几乎都不能解决问题,特别对各大视频网站传回来的html5网页视频自动播放与全屏问题,我 ...

  8. audio与video控件/标签的隐藏,iso/Android下自动全屏播放,短暂黑屏问题

    (一)audio音频标签 <audio src="xxx.mp3"></audio> (二)video视频标签 <video src="xx ...

  9. 微信 vue中使用video.js播放m3u8视频,解决安卓自动全屏的问题。

    最近一个项目中需要在微信中播放m3u8格式的视频,刚开始用了 vue-video-player 这个插件,在IOS手机体验良好,本以为完事了, 结果安卓手机一点播放就自动全屏,心态略崩.查了资料说是安 ...

随机推荐

  1. Linux Shell系列教程之(十二)Shell until循环

    本文是Linux Shell系列教程的第(十二)篇,更多Linux Shell教程请看:Linux Shell系列教程 在上两篇文章Linux Shell系列教程之(十)Shell for循环和Lin ...

  2. redis3.0 集群实战1 -- 安装和配置

    本文主要是在centos7上安装和配置redis集群实战 参考: http://hot66hot.iteye.com/blog/2050676 集群教程: http://redisdoc.com/to ...

  3. SharpGL学习笔记(十七) 立体文字和平面文字

    在写有关文字的主题前,笔者翻阅了几本书上的相关章节,研究了几天无果. 徐明亮<OpenGL游戏编程>书中介绍的是“位图字体”,也就是把字体栅格化,然后画出来.照着书上的VC代码翻译为C#的 ...

  4. Fundamentals of speech signal processing

    PDF版资料下载:链接:http://pan.baidu.com/s/1hrKntkw 密码:f2y9

  5. __proto__

    proto 以前要访问原型, 必须使用构造函数来实现. 无法直接使用实例对象来访问原型. 火狐最早引入属性 __proto__ 表示使用实例对象引用原型. 但是早期是非标准的. 通过该属性可以允许使用 ...

  6. SQLserver2008如何把表格变量传递到存储过程中

    在Microsoft SQL Server 2008中,你可以实现把表格变量传递到存储过程中,如果变量可以被声明,那么它就可以被传递.下面我们来具体介绍如何把表格变量(包括内含的数据)传递到存储过程和 ...

  7. WP修改ProgressBar的前景色

    重载默认主题中的值,修改ProgressBar的前景色 做一个小项目时,用到 ProgressBar添加一个加载效果,但是背景不是白色的,调试时发现自己选的主题色与背景色相近,特别不清晰,加载效果几乎 ...

  8. SharePoint 使用代码为页面添加WebPart

    传统的SharePoint实施中,我们通常会创建SharePoint页面,然后添加webpartzone,而后在上面添加webpart:但是有些情况下,也要求我们使用代码,将webpart添加到相应w ...

  9. ORA-00257归档日志写满的解决方法

    背景: 在前一篇博客中我们提到了如何启动或关闭oracle的归档(ARCHIVELOG)模式,在我成功设定数据库为归档模式以后, 第二天再次尝试连接数据库,报错:ORA-00257.在网上找到了一圈资 ...

  10. 关于一个软件ipa包的其他图片资源

    有时候 当你打开一个ipa包内容的时候    可能会找不到全部的资源     所以你需要在github上下载一个插件 下载下来以后   运行一下 然后会出来这个 把ipa  文件   拖到里面     ...