JS去除浏览器工具栏、菜单栏

2023年2月17日 169次阅读 来源: Abin0406

因项目需要，需对网站通过url访问后，从网站登录页开始全屏，整个网站访问过程中，要求浏览器地址栏隐藏\只读，工具栏，菜单栏等隐藏。

网上找了些方法，以下为使用总结:

浏览器打开窗口全屏设置：

1. 使用fullscreen参数

window.open('index.html', 'newwindow', 'fullscreen=yes, top=0, left=0, toolbar=no, menubar=no, scrollbars=no, resizable=no,location=no, status=no');

结果：fullscreen=yes设置为全屏时，IE11下测试正常，但是chrome下显示非全屏

2.根据显示宽高，设置打开窗口宽高

window.open ('index.html','newwindow','width='+(window.screen.availWidth-10)+',height='+(window.screen.availHeight-30)+',top=0,left=0,toolbar=no,menubar=no,scrollbars=no, resizable=yes,location=no, status=no')

结果：基本可以全屏，暂未找到更好的方案，项目中使用了该方法

全屏设置后，需要将父页面关闭掉

1. 使用window.close(); 结果：IE11下每次都会弹出窗口提示“关闭窗口时会提示“您查看的网页正在试图关闭窗口。是否关闭此窗口””，需要手动确定

2.为了规避确认弹框，修改代码为

        window.opener = null;
        window.open("", "_self");
        window.close();

结果：网站全屏打开，且父页面直接关闭，符合预期。IE、chrome均兼容

以上操作完成页面全屏打开，并对地址栏、工具栏等做了设置，要使得网站被访问时直接全屏，需对服务器欢迎页做配置，服务器使用jetty（tommat等服务类似），欢迎页配置如下：

修改etc\webdefault.xml文件中欢迎页设置为如下：

  <welcome-file-list>
    <welcome-file>index-home.html</welcome-file>
    <welcome-file>index.html</welcome-file>
    <welcome-file>index.htm</welcome-file>
    <welcome-file>index.jsp</welcome-file>
  </welcome-file-list>

因服务欢迎页加载按照以上配置顺序，因此使用index-home.html作为网站跳转页，代码如下：

<!DOCTYPE html><html lang="en"><head>
<SCRIPT LANGUAGE="javascript">
     function openWindow() {
		window.open ('index.html','newwindow','width='+(window.screen.availWidth-10)+',height='+(window.screen.availHeight-30)+',top=0,left=0,toolbar=no,menubar=no,scrollbars=no, resizable=yes,location=no, status=no')
		window.opener = null;
        window.open("", "_self");
        window.close();
	 }

  </SCRIPT>
</head><body onload="openWindow()"></body></html>

window.open中index.html替换为网站欢迎页即可。

    原文作者：Abin0406
    原文地址: https://blog.csdn.net/bin_zi_123/article/details/101195192
    本文转自网络文章，转载此文章仅为分享知识，如有侵权，请联系博主进行删除。
点赞