今天无意中测试了下在 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. CSLA.Net学习（3）INotifyPropertyChanged和IDataErrorInfo

    今天晕晕糊糊的看CSLA.net,希望能找到验证数据正确性的方法,还是摸索出了INotifyPropertyChanged, IDataErrorInfo接口的使用方法,通过INotifyProper ...

  2. C#+GDAL读取影像（1）

    环境:VS2010,C#,GDAL1.7 读取影像: using System; using System.Collections.Generic; using System.ComponentMod ...

  3. 窗口-EasyUI Window 窗口、EasyUI Dialog 对话框、EasyUI Messager 消息框

    EasyUI Window 窗口 扩展自 $.fn.panel.defaults.通过 $.fn.window.defaults 重写默认的 defaults. 窗口(window)是一个浮动的.可拖 ...

  4. ZOJ2588：Burning Bridges（无向连通图求割边）

    题目:http://acm.zju.edu.cn/onlinejudge/showProblem.do?problemId=1588 吐下槽,不得不说ZOJ好坑,模版题做了一个多小时. 题意:*    ...

  5. HTML&CSS&Javascript脑图

    今天看了极客学院的CSS3部分,加上前几天看过的HTML5部分,现在对HTML和CSS的基础有了系统的认识,正好发现这张图,简直Perfect! 感谢脑图的制作人,虽然不知道是谁,但能把HTML.CS ...

  6. 全新办公方式，iClap引领企业级服务新浪潮

    随着企业级服务,SaaS市场的飞速发展,国内市场上,伴随着“马云又一个反人类的社交梦-钉钉”的出现与强势推广,企业协同办公类的产品被不断的呈现在企业的视线中,一时间,似乎我们传统的工作方式好像已经成了 ...

  7. poj3608 Bridge Across Islands

    地址:http://poj.org/problem?id=3608 题目: Bridge Across Islands Time Limit: 1000MS   Memory Limit: 65536 ...

  8. Java Exception 和Error有什么区别？

    ① Exception 和Error 都是继承了Throwable类,在Java中只有Throwable类型的实例才可以被抛出或者捕获,它是异常处理机制的基本类型. ② Exception和Error ...

  9. python中小数点后取2位（四舍五入）以及取2位（四舍五不入）

    一.小数点后取2位(四舍五入)的方法方法一:round()函数其实这个方法不推荐大家使用,查询资料发现里面的坑其实很多,python2和python3里面的坑还不太一样,在此简单描述一下python3 ...

  10. P3327/bzoj3994 [SDOI2015]约数个数和（莫比乌斯反演）

    P3327 [SDOI2015]约数个数和 神犇题解(转) 无话可补 #include<iostream> #include<cstdio> #include<cstri ...