问题描述:在Android中,视频可以正常在H5页面局部播放,iOS中则自动切换至全屏模式. 查看资料得以解决,20190301记录下来。

解决方法:IOS10及以后,在 video标签页中只包含 webkit-playsinline 是不够的,需要再增加 playsinline.

H5端重点代码:

x5-video-player-type='h5' x5-video-player-fullscreen='true' playsinline webkit-playsinline

说明:

  • iOS10以上H5视频不自动全屏播放识别 playsinline这个属性
  • iOS10以下H5视频不自动全屏播放识别 webkit-playsinline这个属性

iOS 端实现代码:

_myWebView.allowsInlineMediaPlayback = YES;

UIWebView 有一个属性如下:

@property (nonatomic) BOOL allowsInlineMediaPlayback NS_AVAILABLE_IOS(4_0); // iPhone Safari defaults to NO. iPad Safari defaults to YES

设置UIWebView 的allowsInlineMediaPlayback属性为YES即可。

提醒:

要仔细测试下,看看是不是存在H5页面关闭后,视频还在播放的现象。

//新跳转一个空白页 防止webview中正在播放的视频消失后还在播放。
[_myWebView loadRequest:[NSURLRequest requestWithURL:[NSURL URLWithString:@"about:blank"]]];

iOS APP 中H5视频默认全屏播放问题解决的更多相关文章

  1. MUI ios下用video标签默认全屏播放

    前几天用Hbuilder+MUI做了个应用,里边用到<video>标签,在Android下正常,但是在苹果手机老是默认全屏播放. 解决办法: 首先在video标签加上playsinline ...

  2. Chrome浏览器中使用 iframe 嵌入网页导致视频不能全屏的问题解决方法

    今天无意中测试了下在 iframe 中嵌入视频, 发现全屏按钮在 Chrome 浏览器中居然无效, 试了好几个视频网站的视频都不能全屏, 但在其他浏览器中似乎都很正常, 应该是 Chrome 60 新 ...

  3. HTML5新标签video在iOS上默认全屏播放

    今天做一个app时发现一个问题,应用html5中的video标签加载视频,在Android手机上默认播放大小,但是换成iPhone手机上出问题了,默认弹出全屏播放,查找了好多论坛,都没有谈论这个的.然 ...

  4. html-----vedio标签(HTML5新标签VIDEO在IOS上默认全屏播放)

    今天做一个app时发现一个问题,应用html5中的video标签加载视频,在Android手机上默认播放大小,但是换成iPhone手机上出问题了,默认弹出全屏播放,查找了好多论坛,都没有谈论这个的.然 ...

  5. andriod\iphone视频禁止全屏播放

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

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

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

  7. VideoView的视频的全屏播放

    import android.net.Uri;import android.os.Bundle;import android.app.Activity;import android.content.I ...

  8. 【wpf基础】wpf MediaElement全屏播放视频功能

    最近在研究如何将视频全屏播放,一开始思路A:弹窗将MediaElement对象add到一个新的全屏窗体,报错 指定的元素已经是另一个元素的逻辑子元素.请先将其断开连接. 后续转换思路B:将本窗体其他控 ...

  9. vue video全屏播放

    需求: 1.视频为长方形,页面初始化打开为横屏全屏播放视频. 2.微信不支持自动播放,故自动播放需求删除. 方法: 1.vue-video-player插件 因需求较简单,仅要求播放本地一个视频,故未 ...

随机推荐

  1. 【PAT】B1003 我要通过!

    我觉得这是PAT中最坑的一道题,表述令人很不适应 分析过程: 条件1.只有P,A,T三种字符 条件2.xPATx正确,x可以是空串,或者由A组成的字符串 条件3.如果aPbTc是正确的,aPbATca ...

  2. Beta冲刺(3/5)(麻瓜制造者)

    今日已完成 邓弘立:完成了登录功能的重构,完成了部分商品管理功能 符天愉:利用ci开始写队友写好的管理员界面,由于后台独立开始使用一个仓库,所以晚上将alpha的版本更新到了git,并且添加了.git ...

  3. mini2440裸机试炼之—RTC闹钟中断,节拍中断

    版权声明:博客地址:http://blog.csdn.net/muyang_ren.源代码能够在我的github上找看看 https://blog.csdn.net/muyang_ren/articl ...

  4. cenos下配置Apache+PHP最新版7.1.6+MySQL最新版(5.7.18)

    一.安装Apache,略. 二.安装PHP 1.下载php7 wget -O php7.tar.gz http://cn2.php.net/distributions/php-7.1.6.tar.gz ...

  5. 基于Redis实现一个安全可靠的消息队列

    http://doc.redisfans.com/list/rpoplpush.html

  6. P3265 [JLOI2015]装备购买(高斯消元+贪心,线性代数)

    题意; 有n个装备,每个装备有m个属性,每件装备的价值为cost. 小哥,为了省钱,如果第j个装备的属性可以由其他准备组合而来.比如 每个装备属性表示为, b1, b2.......bm . 它可以由 ...

  7. 课程设计小组报告——基于ARM实验箱的捕鱼游戏的设计与实现

    课程设计小组报告--基于ARM实验箱的捕鱼游戏的设计与实现 一.任务简介 1.1 任务内容 捕鱼游戏这个项目是一个娱乐性的游戏开发,该游戏可以给人们带来娱乐的同时还可以给人感官上的享受,所以很受人们的 ...

  8. mocha测试框架-truffle

    https://mochajs.org/
学习网址:
https://www.jianshu.com/p/9c78548caffa
https://www.jb51.net/article/10646 ...

  9. 使用RMAN Active duplicate创建异地auxiliary Database

    1g的RMAN duplicate 可以通过Active database duplicate和Backup-based duplicate两种方法实现.这里的测试使用的是Active databas ...

  10. python 经典博客链接

    1, 从文件的读取与输出: http://www.cnblogs.com/xuxn/archive/2011/07/27/read-a-file-with-python.html http://www ...