苹果手机刚刚出来的时候,他们就推出系列meta标签来解决实现WebAPP类APP的问题,只需要在HTML head中添加如下代码就可以隐藏掉浏览器的地址栏和下方bar:
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
但是安卓出来后,并没有这样做,但是最近在我的google N4上更新chrome后,发现通过打开浏览器以后,将网站添加到主屏以后,在桌面上访问这个网站,居然地址不见了。我最开始是别人的网站添加了什么特殊的代码,经过分析,原来就是上面的两段代码起了作用。
我的Chrome版本为:37.0.2062.117
安卓Chrome认为这种方式是网络应用,下面我们来看看方法和效果:
将通过浏览器访问的网站添加到主屏:
以前的效果,访问后依然存在地址栏:
现在的效果,地址栏已经不见了:
如果你不信,你如果用的安卓chrome,添加一个w3ctech到你的主屏试试?
扫码关注w3ctech微信公众号
minimal-ui 那这么是干什么用的
@树残由尔 minimal-ui 是用于你直接用浏览器访问的时候,快速隐藏掉用的,就像以前的使用js,滚动100px。
@树残由尔 minimal-ui 是ios7新增的,安卓chrome还不支持。
minimal-ui 在iOS8里被弃用了吧
@Kejun 嗯,是的,不知道为什么弃用
共收到5条回复