今天无意中测试了下在 iframe 中嵌入视频, 发现全屏按钮在 Chrome 浏览器中居然无效, 试了好几个视频网站的视频都不能全屏, 但在其他浏览器中似乎都很正常, 应该是 Chrome 60 新版本对权限的控制都越来越严格精细的原因

按钮点了没反应, 始终不能全屏

解决办法也很简单, 就是增加一个属性 allowfullscreen 就行了

例子:

<iframe src="https://v.qq.com/x/cover/vtxb95np45a6ooz.html#mod_player" frameborder="0" width="100%" height="100%"></iframe>

加上属性后

<iframe src="https://v.qq.com/x/cover/vtxb95np45a6ooz.html#mod_player" allowfullscreen frameborder="0" width="100%" height="100%"></iframe>

这样就可以实现全屏啦

Chrome浏览器中使用 iframe 嵌入网页导致视频不能全屏的问题解决方法的更多相关文章

  1. 去掉chrome浏览器中input或textarea在得到焦点时出现黄色边框的方法

    此文来源网络,我转载的原文里的图显示“该图片仅限百度用户内部交流使用”,我估计这篇文章是从百度空间抄过来的,该作者没保留原文地址.所以我在这里也没保留抄袭文章的地址. chrome浏览器不管对于开发者 ...

  2. iOS APP 中H5视频默认全屏播放问题解决

    问题描述:在Android中,视频可以正常在H5页面局部播放,iOS中则自动切换至全屏模式. 查看资料得以解决,20190301记录下来. 解决方法:IOS10及以后,在 video标签页中只包含 w ...

  3. 用mac的chrome浏览器调试Android手机的网页

    一.参考链接 read chrome remote debugging documentation 调出开发者选项 二.设置android 在安卓4.2及更新的版本中,默认情况下,[开发者选项]是隐藏 ...

  4. chrome 浏览器的预提取资源机制导致的一个请求发送两次的问题以及ClientAbortException异常

    调查一个 pdf 打印报错: ExceptionConverter: org.apache.catalina.connector.ClientAbortException: java.net.Sock ...

  5. [转]chrome浏览器中 F12 功能的简单介绍

    本文转自:https://www.cnblogs.com/zhuzhubaoya/p/9758648.html chrome浏览器中 F12 功能的简单介绍 由于F12是前端开发人员的利器,所以我自己 ...

  6. 【F12】chrome浏览器中 F12 功能的简单介绍

    chrome浏览器中 F12 功能的简单介绍 由于F12是前端开发人员的利器,所以我自己也在不断摸索中,查看一些博客和资料后,自己总结了一下来帮助自己理解和记忆,也希望能帮到有需要的小伙伴,嘿嘿! 首 ...

  7. Chrome浏览器如何调试移动端网页信息

    Chrome浏览器如何调试移动端网页信息 2017年08月12日 12:42:20 阅读数:835 最近在弄项目,用WebView加载一个页面,想追踪页面中一个按钮的点击事件.这个可能就需要调试这个页 ...

  8. 爬虫 Http请求,urllib2获取数据,第三方库requests获取数据,BeautifulSoup处理数据,使用Chrome浏览器开发者工具显示检查网页源代码,json模块的dumps，loads，dump，load方法介绍

    爬虫 Http请求,urllib2获取数据,第三方库requests获取数据,BeautifulSoup处理数据,使用Chrome浏览器开发者工具显示检查网页源代码,json模块的dumps,load ...

  9. 在Chrome浏览器中保存的密码有多安全？

    本文由 伯乐在线 - 黄利民 翻译.未经许可,禁止转载!英文出处:howtogeek.欢迎加入翻译组. [2013-08-09 更新]:最近又开始讨论“Chrome浏览器明文保存密码这个话题了,国外一 ...

随机推荐

  1. java, android的aes等加密库

    https://github.com/scottyab/AESCrypt-Android https://github.com/PDDStudio/EncryptedPreferences       ...

  2. scRNA-seq测序的两种技术[转载]

    转自:http://www.ebiotrade.com/newsf/2017-9/201795172237350.htm 1.综述 哈佛大学的两个团队将微流体技术引入单细胞RNA-Seq方法中,分别开 ...

  3. 模块讲解----configparser模块（my.cnf配置文件操作）

    查询 1.所有节点: 2.指定节点下的所有key和values: 3.指定节点下所有的key: 4.指定节点和key下的values: # #configparser用于处理特定格式的文件,其本质上是 ...

  4. Sparsity稀疏编码（一）

    稀疏编码来源于神经科学,计算机科学和机器学习领域一般一开始就从稀疏编码算法讲起,上来就是找基向量(超完备基),但是我觉得其源头也比较有意思,知道根基的情况下,拓展其应用也比较有底气.哲学.神经科学.计 ...

  5. MapReduce的几个实现

    1.倒排索引的实现 import java.io.IOException; import java.util.StringTokenizer; import org.apache.hadoop.con ...

  6. postman设置环境变量，字段值经过json转换后数值字节长度超过上限的问题

    在使用Tests进行环境变量的设置时,遇到这么一种情况,在返回的responseBody中的userId字段,字段返回的是数值类型,再经过json转换之后,发现保存的值跟接口返回的值不一致:如下图: ...

  7. pyDay16

    内容来自廖雪峰的官方网站. 1.Python内建的filter()函数用于过滤序列. 2.和map()类似,filter()也接收一个函数和一个序列.和map()不同的是,filter()把传入的函数 ...

  8. Sybase中的load table的用法

    Sybase中的load table的用法 用sybase iq作为数据仓库的存储,确实有其独特的特点和优势,但是在数据ETL的时候,如果用insert.update方式,速度太慢,大概是2秒钟左右一 ...

  9. 2017-2018-1 JaWorld 第四、五周作业

    2017-2018-1 JaWorld 第四.五周作业 两周工作内容 小组讨论并确定最终的app雏形 合作完成需求说明书 工作分工 成员 分工 比例 陈是奇 1.引言 8% 马平川 2.1-2.5 产 ...

  10. 在JAVA可移植性的来源的三方面

    软件可移植性的概念是与软件从某一环境转移到另一环境下的难易程度.为获得较高的可移植性,在设计过程中常采用通用的程序设计语言和运行支撑环境.尽量不用与系统的底层相关性强的语言.下面介绍JAVA的可移植性 ...