HTML5 隐藏地址栏 兼容IOS 与安卓
现在有一个问题： 如果手机是 一屏一屏的滑动的，就不能 隐藏了。
来源:https://github.com/scottjehl/Hide-Address-Bar
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Test page</title><title>Cross-device Address Bar Hide - Example 1</title> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <script src="hide-address-bar.js"></script> <style> /* DEMO ONLY for this short page - remove in live code */ body { min-height: 480px; } </style> </head> <body> <p>The script on this page should hide the address bar on iOS and Android.</p> </body> </html> <script type="text/javascript"> (function( win ){ var doc = win.document; // If there's a hash, or addEventListener is undefined, stop here if(!win.navigator.standalone && !location.hash && win.addEventListener ){ //scroll to 1 win.scrollTo( 0, 1 ); var scrollTop = 1, getScrollTop = function(){ return win.pageYOffset || doc.compatMode === "CSS1Compat" && doc.documentElement.scrollTop || doc.body.scrollTop || 0; }, //reset to 0 on bodyready, if needed bodycheck = setInterval(function(){ if( doc.body ){ clearInterval( bodycheck ); scrollTop = getScrollTop(); win.scrollTo( 0, scrollTop === 1 ? 0 : 1 ); } }, 15 ); win.addEventListener( "load", function(){ setTimeout(function(){ //at load, if user hasn't scrolled more than 20 or so... if( getScrollTop() < 20 ){ //reset to hide addr bar at onload win.scrollTo( 0, scrollTop === 1 ? 0 : 1 ); } }, 0); }, false ); } })( this ); </script>
这两个 标签 也是隐藏 地址栏的，但是IOS 上苹果浏览器不起作用。
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent" />
还有一个问题关于微信的
用微信打开网页时， 用把 数字 变色 ，还可以拨号。 禁止这样情况 在网页头部加上：
<meta content="telephone=no" name="format-detection" />
