问题描述:在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】B1002 写出这个数

    思路: 1.以字符串形式输入数据,计算结果 2.使用sprintf将结果数字转换为字符串(将数字每一位分开) 3.分别输出字符每一位 1,笨方法,用的ifelse来判断输出 #include<s ...

  2. 【日常开发】使用多种工具实现 sql查询没有结果的name

    本文地址 分享提纲: 1. 事情的背景 2. 解决办法 3. 总结 1. 事情的背景 现在需要将2000条数据的name,从user表中查询出来结果,sql 这样写 SELECT * FROM use ...

  3. 如何自定义FusionCharts图表上的工具提示?

    中的工具提示是什么?当鼠标悬停在一个特定的数据点上时就会显示工具提示,提示以下信息: 单系列图表(饼图和圆环除外):名称及数值 Pie & Doughnut:名称及数值/百分比 多系列组合图表 ...

  4. RocketMQ集群部署记录

    RocketMQ集群部署记录 #引用    https://cloud.tencent.com/developer/article/1147765         一.RocketMQ基础知识介绍 A ...

  5. http://blog.csdn.net/pipisorry/article/details/51471222

    这个博主很有意思 机器学习之用Python从零实现贝叶斯分类器 参数估计:贝叶斯思想和贝叶斯参数估计

  6. P1823 [COI2007] Patrik 音乐会的等待 单调栈 洛谷luogu

    题目描述 N个人正在排队进入一个音乐会.人们等得很无聊,于是他们开始转来转去,想在队伍里寻找自己的熟人.队列中任意两个人A和B,如果他们是相邻或他们之间没有人比A或B高,那么他们是可以互相看得见的. ...

  7. 关于html的a标签的target="__blank "的安全漏洞问题

    使用场景:最近项目中使用一个a标签的 target="__blank "链接跳转 页面,打开一个新的 pdf文件(或者外部的一个网页),然后在chrome浏览器中快速的滑动的时候, ...

  8. LNMP安装201812012237

    发表这篇文章最初的意愿是想做个最新版的zabbix使用,后来看了下好多“软件”都升级了(如nginx.mysql等),就想干脆做个最新版本的LNMP环境得了,再单独做zabbix的最新版本省得以后升级 ...

  9. linux笔记-多服务器同时执行相同命令

    1.服务器的ip地址写到文件中,命名为nodelist.txt 192.168.1.160 192.168.1.166 2.编写运行脚本 for i in `cat nodelist.txt`do s ...

  10. [04] 高级映射 association和collection

    之前我们提到的映射,都是简单的字段和对象属性一对一,假设对象的属性也是一个对象,即涉及到两个表的关联,此时应该如何进行映射处理? 先看两张表,author 和 book:    业务上对应关系为,一个 ...