今天无意中测试了下在 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. 【开发者笔记】MQTT python测试笔记

    MQTT是基于订阅/发布的物联网协议. python测试需要一个发送进程和接收进程,即一个发送客户端和一个接收客户端,如果这两个客户端工作在同一个topic下,那么就能进行消息互通了. 服务器用“io ...

  2. Selenium之Chrome浏览器的启动

    1.下载Chromedriver.exe文件放至需要的目录中: 2.编写代码 import org.openqa.selenium.WebDriver; import org.openqa.selen ...

  3. 【转】Deep Learning（深度学习）学习笔记整理系列之（七）

    9.5.Convolutional Neural Networks卷积神经网络 卷积神经网络是人工神经网络的一种,已成为当前语音分析和图像识别领域的研究热点.它的权值共享网络结构使之更类似于生物神经网 ...

  4. python 面向对象编程学习总结

    面向对象是个抽象的东西,概念比较多,下面会一一介绍. 一.类和实例 类(Class)和实例(Instance)是面向对象最重要的概念. 类是指抽象出的模板.实例则是根据类创建出来的具体的“对象”,每个 ...

  5. 本地blast的安装

    1 下载程序 在ftp://ftp.ncbi.nlm.nih.gov/blast/executables/blast+/LATEST/下载 ncbi-blast-2.2.25+-x64-linux.t ...

  6. php中的set_magic_quotes_runtime()作用和用法

    set_magic_quotes_runtime 用来设置php.ini文件中的magic_quotes_runtime值,当遇到反斜杆(\).单引号(').双引号(")这样一些的字符定入到 ...

  7. SQL: 为列取有意义的名称

    1.用法 2.在where字句中使用别名要注意,(别名是select之后才会生效)

  8. SQL学习笔记二之MySQL的数据库操作

    阅读目录 一 系统数据库 二 创建数据库 三 数据库相关操作 一 系统数据库 information_schema: 虚拟库,不占用磁盘空间,存储的是数据库启动后的一些参数,如用户表信息.列信息.权限 ...

  9. c++语言中的遍历

    原文地址:http://www.cnblogs.com/xylc/p/3653036.html 随着C++11标准的出现,C++标准添加了许多有用的特性,C++代码的写法也有比较多的变化. vecto ...

  10. 20145309李昊《网络对抗》MSF应用基础

    实验内容 掌握metasploit的基本应用方式1.主动攻击——ms08_0672.针对浏览器的攻击——ms11_0503.针对客户端的攻击——Adobe4.成功应用一个辅助模块——scanner/d ...