最新下载
热门教程
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
HTML5 requestFullScreen实现网页全屏的例子
时间：2022-06-25 18:18:26 编辑：袖梨 来源：一聚教程网
html5新的api——requestFullScreen，可以实现当前浏览页面全屏，这在手机端效果还是不错的，下面是一个演示例子：
视频等全屏目前只有google chrome 15 +, safri5.1+,firfox10+,IE11支持
javascript" >
// 找到适合浏览器的全屏方法
function launchFullScreen(element) {
if(element.requestFullScreen) {
element.requestFullScreen();
}else if(element.mozRequestFullScreen) { //兼容moz
element.mozRequestFullScreen();
}else if(element.webkitRequestFullScreen) { //兼容webkit
element.webkitRequestFullScreen();
}
}
//退出全屏
function exitFullscreen() {
if(document.exitFullscreen) {
document.exitFullscreen();
}else if(document.mozCancelFullScreen) { //兼容moz
document.mozCancelFullScreen();
}else if(document.webkitExitFullscreen) { //兼容webkit
document.webkitExitFullscreen();
}
}
在浏览器全屏的使用我们还可以进行样式设置
html:-moz-full-screen {
background: red;
}
html:-webkit-full-screen {
background: red;
}
html:fullscreen {
background: red;
}
123456
相关文章
- 原神伊涅芙长什么样 伊涅芙立绘一览 07-12
- 我的新加密货币税收法案将终结不公平行为：参议员卢米斯 07-12
- 剑星活肤紧身服怎样进行获取呢 活肤紧身服收集方法介绍 07-12
- 原神伊涅芙的定位是什么 伊涅芙定位介绍 07-12
- 原神伊涅芙是哪个国家的 伊涅芙所属国家介绍 07-12
- 无畏契约源能行动官网地址 官网预约地址介绍 07-12