全屏模式:kiosk
这个单词很很特殊吧?没错,它其实是从「报刊亭」引申出的一直「自助服务亭」的意思,是否我们可以理解为,kiosk 模式就是去掉用户可操作的界面,仅仅给用户一个和服务有关的界面呢?直接猜想。
默认全屏打开一个网页呢,只需要在快捷方式中加上 –kiosk [url] 就可以了,如下图:
关于全屏模式,有几点需要注意:
1、全屏模式下,广告插件(例如 adblock)是有作用的,所以目标页面的一些样式名称、url 地址,都一样要注意避免 ad 字样;
2、全屏模式下,按 F11 是不会退出全屏的,鼠标移动到屏幕上方也不会提示退出全屏;
3、全屏模式下,是没有关闭按钮的,除非用户懂得 ctrl w 可以关闭,否则自己在网页上加入退出菜单;
4、全屏模式下,是有多标签的,当你在页面中使用了 target=”_blank” 打开一个新标签页之后,用户虽然看不出来,但是,关闭了一个,会显示出原来的页面,所以应该尽量避免新窗口打开;
5、如果当前运行着其它的 Chrome 窗口,那么全屏化打开是无效的,会直接在现有的 Chrome 以新标签的方式打开;
6、全屏模式下,按 ctrl shift b 快捷键是无法调出书签栏的;
以上是开发中可能会遇到的一些疑难杂症,当作一份总结。
应用模式:APP
APP 模式这个就比较正常了,APP 也是近年来一个很火的概念,动不动就「做个APP」,呵呵。
APP 模式的参数相对通俗易懂一些,在快捷方式后面追加 –app=[url] 即可,如下图:
关于 APP 模式,有几点需要注意的:
1、同上,在 APP 模式中,广告插件是有作用的,需要注意样式名和 url 地址中不要包含 ad 字样;
2、APP 模式在启动之后,呈现一个竖屏的效果,宽度并不等于用户的屏幕宽度,但是是可调的,也有最大化按钮,并且在下次启动时,会延续上次的宽度;
3、APP 模式中同样是没有地址栏、没有工具栏、没有书签栏的,快捷键也无法调出;
4、APP 模式下,系统任务栏的图标会变成网页的 favicon 图标,而且窗口标题没有了 Google Chrome 的字样;
5、APP 模式下,是没有多标签的,当网页中出现 target=”_blank” 需要在新窗口打开时,会调用或启动默认浏览器来打开目标网址,用户会从 APP 模式中脱离;
这几条也是在使用时发现的一些问题,或者说是需要注意的地方,希望以后在开发的时候多注意,别走弯路。
方法/步骤
kiosk是终极全屏模式,打开时直接进入全屏模式,且无法使用 F11 和 ESC 退出全屏幕模式,可以用 Alt + F4 或 Ctrl + W快捷键关闭全屏窗口。修改Chrome的快捷方式,增加起动参数–kiosk即可。如下启动命令会以全屏模式打开百度首页。
“C:\Program Files (x86)\Google\Chrome\Application\chrome.exe” –kiosk www.abczn.com
kiosk模式打开的Chrome窗口,使用的是Chrome默认用户的数据文件夹。为了和默认用户互不影响,可以增加启动参数 –user-data-dir=”c:\chrome_data” ,就可以实现将浏览数据保存到c:\chrome_data这个文件夹下面,这个文件夹不需要自己创建,Chrome会自动创建。
“C:\Program Files (x86)\Google\Chrome\Application\chrome.exe” –user-data-dir=”c:\chrome_data” –kiosk www.abczn.com
在Chrome地址栏中输入:chrome://flags/#overscroll-history-navigation,会定位到滚动历史记录导航选项,将该选项的设置改成”Disabled“(已停用)就可以禁用手指拖拽到上一页/下一页。
在Chrome快捷方式的参数列表上加上: –disable-pinch,就可以禁用手指缩放了。
“C:\Program Files (x86)\Google\Chrome\Application\chrome.exe” –user-data-dir=”c:\chrome_data” –kiosk –disable-pinch www.abczn.com
使用 kiosk 模式后,可能会因 HTML内文是英文而自动跳出这个翻译信息,在 kiosk 模式这当然是不想要的,在参数列加上 –disable-translate 即可。
“C:\Program Files (x86)\Google\Chrome\Application\chrome.exe” –user-data-dir=”c:\chrome_data” –kiosk –disable-pinch –disable-translate www.abczn.com
长按屏幕时会触发选取文字效果,若不想被选取,可以利用 CSS 处理,在网页中加入下面的CSS样式就杺禁止文字选取了。
html { -webkit-user-select: none;}