转载:关于 Google Chrome 中的全屏模式和 APP 模式

前言:我一直在纠结这篇文章是否应该归类在「前段开发」的范围内,哈哈!

前段时间做了一个项目,涉及到一个要全屏模式去访问网页的需求,因为 Google Chrome 的效率不错,而且专门为 Chrome 做网页也省事许多,所以就在网上找如何让 Chrome 在允许的时候直接全屏模式。还以为会是 fullscreen 之类的参数,没想到参数名还挺偏的。

正巧最近和同事说到这个时,同事告诉我还有一个 APP 模式,也可以用来满足一些特殊需求,今晚都尝试了一下,两者之间有各自的用途,说说我的想法吧。

全屏模式: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 模式中脱离;

这几条也是在使用时发现的一些问题,或者说是需要注意的地方,希望以后在开发的时候多注意,别走弯路。

最后

一如既往的来几句结尾。 
这两个特殊模式,都有一定的用途,比如做企业内部网站时,比如做个触摸屏应用时,等等,至于在什么情况下用什么模式,当然要看需求而定,只是在使用的时候需要注意以上的问题。

时间: 2024-10-03 00:14:52

转载:关于 Google Chrome 中的全屏模式和 APP 模式的相关文章

Google Chrome中的高性能网络 (三)

使用预连接优化了TCP连接管理 已经预解析到了主机名,也有了由OmniBox和Chrome Predictor提供信号,预示着用户未来的操作.为什么再进一步连接到目标主机,在用户真正发起请求前完成TCP握手呢?这样就可省掉了另一个往返的延迟,轻易地就能为用户节省到上百毫秒.其实,这就是TCP预连接的工作. 通过访问chrome://dns 就可以看到TCP预连接的使用情况. 首先, Chrome检查它的socket pool里有没有目标主机可以复用的socket, 这些sockets会在sock

frameset 在 Google Chrome 中无法隐藏左边栏解决方法!

使用Frameset 框架,发现在IE下, <frameset name="mainDefine" cols="200,10,*" frameborder="NO" border="0" framespacing="0" rows="*"> <frame name="LeftFrame" noresize scrolling="auto&q

Google Chrome中的高性能网络(二)

Chrome Predictor的预测功能优化 Chrome会随着使用变得更快. 它这个特性是通过一个单例对象Predictor来实现的.这个对象在浏览器内核进程(Browser Kernel Process)中实例化,它唯一的职责就是观察和学习当前网络活动方式,提前预估用户下一步的操作.下面是一个示例: 用户将鼠标停留在一个链接上,就预示着一个用户的偏好以及下一步的浏览行为.这时Chrome就可以提前进行DNS Lookup及TCP握手.用户的点击操作平均需要将近200ms,在这个时间就可能处

Ajax请求在IE和Google Chrome中可以响应,在Firefox中无法响应

在工作中碰到这么一个问题,发送ajax请求,在IE和chrome中可以正常的响应,但是在Firefox中无法响应,代码如下: JS代码: 1 function Sure(obj) { 2 var statu = confirm("是否确认删除?"); 3 if (!statu) { 4 return false; 5 } 6 var objOrderID = obj.id; 7 $.ajax( 8 { 9 type: "Post", 10 url: "/A

Google Chrome抓包分析详解

Google Chrome抓包分析详解 一:什么是抓包 即抓取我们本地电脑与远端服务器通信时候所传递的数据包 二:Chrome浏览器讲解 Chrome 开发者工具是一套内置于Google Chrome中的Web开发和调试工具,可用来对网站进行迭代.调试和分析 三:打开Chrome开发者工具 在Chrome界面按F12 or在页面元素上右键点击,选择“检查” 四:开发者工具的结构 Elements(元素面板):使用“元素”面板可以通过自由操纵DOM和CSS来重演您网站的布局和设计. Console

Chrome 中调试Javascript

使用Chrome打开我们要调试的页面,然后使用快捷键F12打开开发者工具,当然,你也可以在工具菜单中找到.Chrome开发者工具如图: Elements选项卡是对界面上的元素进行选择的,我们要进行调试的代码在Sources 选项卡中. 打开Sources选项卡,点击左侧的小箭头打开所有资源,选择我们的页面: 我们要调试这个页面的代码,所以就打开这个页面,然后点击行号可以添加断点: 点击界面中的按钮,我们能够捕获到刚添加的断点: 添加监视的方法和在IE中的方法是一样的:选中变量,在变量上面单击,选

在Chrome 中调试Javascript

在前面的两篇文章中我们讲了如何在IE中调试Javascript和在Visual Studio中调试Javascript,在本篇内容中,我们讲一下如何在谷歌 Chrome中调试Javascript. Chrome 是Google 提供的一款非常优秀的浏览器,内置了开发者工具,可以方便我们对JS代码进行调试.有了使用IE来调试Javascript的经验,在使用Chrome进行调试的时候会变得很方便. 使用Chrome打开我们要调试的页面,然后使用快捷键F12打开开发者工具,当然,你也可以在工具菜单中

在 Ubuntu 14.04 Chrome中安装Flash Player(转)

在 Ubuntu 14.04 中安装 Pepper Flash Player For Chromium 一个 Pepper Flash Player For Chromium 的安装器已经被 Ubuntu 14.04 的官方源收录. Flash Player For Linux 自11.2 起已经停止更新,目前 Linux 平台下面的 Flash Player 只能依靠 Google Chrom 的 PPAPI (Pepper Flash Player)进行更新(Chrome Only)(Ado

利用Google Chrome开发插件,在网页中植入js代码

Google Chrome是一个很强大的浏览器,提供了各种各样的插件,大大提升了使用了的效率,比如vimium.honx等. Google在提供这些插件的同时还允许用户开发自己的插件. 最近在写js的脚本采集程序,需要测试在网页中的运行情况,因此可以利用Chrome插件进行测试. 1.首先第一步是新建一个文件夹,并新建一个manifest.json文件,内容如下 { "manifest_version": 2, "name": "Js implants&q