js realizes full screen (f11)

js to achieve browser full screen

When the page automatically triggers full screen, an error will be reported, and the browser will give a warning as follows, which means that the browser full screen API can only be triggered by user gestures . Tried window.onload, timer, mouse movement event can not achieve full screen, click event can.
Full screen api document address: https://developer.mozilla.org/zh-CN/docs/Web/API/Fullscreen_API

Simple implementation of click full screen code:

<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>

Google, Firefox, Edg, 360 speed mode can all achieve full screen, 360 compatibility mode does not take effect

window.open realizes the hiding of browser toolbars, etc.

The effect is as follows:
insert image description here
the code is as follows:

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 definition and usage

open()method is used to open a new browser window or find a named window.

grammar

window.open(URL,name,specs,replace*)

Parameter Description

  • URL
    is optional. Open the URL of the specified page. If no URL is specified, opens a new blank window.
  • name
    is optional. Specifies targetthe name of the property or window. The following values ​​are supported:
    _blankload in a new window, which is the default
    _parentto load into the parent frame
    _selfreplacing the current page
    _topreplace any loadable frameset
    *name*window name
  • specs
    channelmode=yes\|no\|1\|0Whether to display the window in theater mode, the default is no, only IE browser directories=yes\|no\|1\|0whether to add a directory button, the default is yes, only IE browser
    fullscreen=yes\|no\|1\|0whether the browser displays full-screen mode, the default is no, in full-screen mode The window must also be in theater mode, only the height of the IE browser
    height=pixelswindow, the minimum value is 100 Whether to display the address field
    left=pixelson the left side of the window , the default value is yes Whether to display the menu bar, the default value is yes Whether the window can be adjusted size, the default value is yes whether to show scroll bars, the default value is yes whether to add a status bar, the default value is yes whether to show the title bar. Ignored unless calling an HTML application or a trusted dialog, the default value is yes Whether to display the browser toolbar, the default value is the position at the top of the yes window, only the width of the IE browser window, the minimum value is 100
    location=yes\|no\|1\|0
    menubar=yes\|no\|1\|0
    resizable=yes\|no\|1\|0
    scrollbars=yes\|no\|1\|0
    status=yes\|no\|1\|0
    titlebar=yes\|no\|1\|0
    toolbar=yes\|no\|1\|0
    top=pixels
    width=pixels

Guess you like

Origin blog.csdn.net/weixin_46724655/article/details/123229159