本文主要是介绍js实现全屏(f11),希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!
js实现浏览器全屏
当页面自动触发全屏会报错,并且浏览器会给一个警告如下,意思是浏览器全屏API只能由用户手势触发。尝试过window.onload、定时器、鼠标移动事件都不能实现全屏,点击事件可以。
全屏api文档地址:https://developer.mozilla.org/zh-CN/docs/Web/API/Fullscreen_API
简单实现点击全屏代码:
<body><button onclick="fullScreen()">浏览器全屏</button>
</body>
<script type="text/javascript">//实现全屏function fullScreen() {// documentElement 属性以一个元素对象返回一个文档的文档元素var el = document.documentElement;el.requestFullscreen||el.mozRequestFullScreen||el.webkitRequestFullscreen||el.msRequestFullScreen?el.requestFullscreen()||el.mozRequestFullScreen()|| el.webkitRequestFullscreen()||el.msRequestFullscreen():null;}</script>
谷歌、火狐、Edg、360极速模式都可以实现全屏,360兼容模式不生效
window.open实现浏览器工具栏等的隐藏
效果如下:
代码如下:
window.open ('newHtml.html','_blank',
'width='+(window.screen.availWidth)+',height='+(window.screen.availHeight)+
',top=0,left=0,toolbar=no,menubar=no,scrollbars=no, resizable=yes,location=no, status=no')
window.open定义和用法
open()
方法用于打开一个新的浏览器窗口或查找一个已命名的窗口。
语法
window.open(URL,name,specs,replace*)
参数说明
- URL
可选。打开指定的页面的URL。如果没有指定URL,打开一个新的空白窗口。 - name
可选。指定target
属性或窗口的名称。支持以下值:_blank
加载到一个新的窗口,这是默认_parent
加载到父框架_self
替换当前页面_top
替换任何可加载的框架集*name*
窗口名称 - specs
channelmode=yes\|no\|1\|0
是否要在影院模式显示 window,默认是没有的,仅限IE浏览器directories=yes\|no\|1\|0
是否添加目录按钮,默认是肯定的,仅限IE浏览器
fullscreen=yes\|no\|1\|0
浏览器是否显示全屏模式,默认是没有的,在全屏模式下的 window,还必须在影院模式,仅限IE浏览器
height=pixels
窗口的高度,最小值为100
left=pixels
该窗口的左侧位置
location=yes\|no\|1\|0
是否显示地址字段,默认值是yes
menubar=yes\|no\|1\|0
是否显示菜单栏,默认值是yes
resizable=yes\|no\|1\|0
是否可调整窗口大小,默认值是yes
scrollbars=yes\|no\|1\|0
是否显示滚动条,默认值是yes
status=yes\|no\|1\|0
是否要添加一个状态栏,默认值是yes
titlebar=yes\|no\|1\|0
是否显示标题栏.被忽略,除非调用HTML应用程序或一个值得信赖的对话框,默认值是yes
toolbar=yes\|no\|1\|0
是否显示浏览器工具栏,默认值是yes
top=pixels
窗口顶部的位置,仅限IE浏览器
width=pixels
窗口的宽度,最小值为100
这篇关于js实现全屏(f11)的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!