先来看一张截图
红色框处就是用手机浏览器打开页面时，自动显示出来的头部地址栏和底部工具栏
如果现在有一个需求，用手机浏览器打开页面时，把地址栏和工具栏隐藏，该怎么办呢？
起初我在度娘找到了好几篇博客都推荐如下方法
注：但使用该方法没有效果(可能该属性只针对iOS 7.1 的 Safari 有用)
几经波折，我发现并没有直接能够隐藏掉地址栏和工具栏的方法，但有一个折中的方法。
手机浏览器打开页面时，地址栏和工具栏不隐藏，当你往上滑动页面时再隐藏，往下滑动页面时再显示
window.onload = function() {
setTimeout(function() {
window.scrollTo(0, 1)
}, 0);
};
但加上这段代码后，可能没有效果。这是因为页面内容较少时，不会隐藏地址栏；但网页内容较多，超过屏幕可视高度，才会自动隐藏地址栏
那如何解决在内容较少时，同样隐藏地址栏呢？添加如下代码即可
window.onload = function() {
scroll();
}
function scroll() {
if(document.documentElement.scrollHeight <= document.documentElement.clientHeight) {
bodyTag = document.getElementsByTagName('body')[0];
bodyTag.style.height = document.documentElement.clientWidth / screen.width * screen.height + 'px';
}
}
补充：还有一种更简单的方法，直接使用meta标签
微信QQ打开网页时提示用浏览器打开
微信QQ打开网页时提示用浏览器打开 一,需求分析 1.1,使用微信或QQ打开网址时,无法在微信或QQ内打开常用下载软件,手机APP等.故此需要在微信qq里提示 二,功能实现 2.1 html实现 &l ...
Win打开网页时总是提示添加网址到信任站点的设置方法
在WIN系统中,我们打开网页,或打开网站,或浏览网页时,老是跳出一个窗口提示“添加网址到信任站点”,“网页老是提示添加信任”或“每打开一次网页都要加入受信任站点”或“win提示 ...
IOS safari浏览器登陆时Cookie无法保存的问题
近期完成了一个儿童的测评项目,测试到最后的时候发现在ipadmini上登陆成功之后无法跳转页面,而安卓和pc端都可以,找了大半天bug,发现其他的苹果设备都没问题,只能一个一个的调试,结果发现设备的 ...
用webview打开网页时，里面有个div带滚动条的，但是在平板上滚动条失效
android2.3的不支持滚动条,并且scrollTop也不支持的.(设置overflow未hidden就可以支持). function noBarsOnTouchScreen(arg) { var ...
用JS打开网页时自动更改css样式，可用于处理浏览器兼容
代码:
{ co ...
解决IOS safari在input focus弹出输入法时不支持position fixed的问题
该文章为转载 我们在做移动web应用的时候,常常习惯于使用position:fixed把一个input框作为提问或者搜索框固定在页面底部.但在IOS的safari和webview中,对position ...
inno安装卸载时检测程序是否正在运行卸载完成后自动打开网页-代码无效
inno安装卸载时检测程序是否正在运行卸载完成后自动打开网页-代码无效 inno setup 安装卸载时检测程序是佛正在运行卸载完成后自动打开网页-代码无效 --------------------- ...
Winform中怎样对窗体进行隐藏，再次打开时仍然保留上次的窗体
场景 点击按钮后打开窗口,点击窗口的确定按钮后即使窗体返回了Ok,此时不关闭窗体,将窗体隐藏. 再次点击按钮后,仍然打开上次的窗体. 注: 博客主页: /ba ...
随机推荐
MapReduce和Spark写入Hbase多表总结
作者:Syn良子 出处:/cssdongl 转载请注明出处 大家都知道用mapreduce或者spark写入已知的hbase中的表时,直接在mapreduc ...
PCI Express(一)- Connector
