I know 1 way of doing this.
<body onload="setTimeout(function() {window.scrollTo(0, 1)}, 100)"> ... </body>
But this works only if the page is big enough to be scrolled. If the page fits the screen the above function wont work. How to hide the address bar in this case ? I need to get it to work with iphone, ipad, android devices.
To get started enter “about:flags” into the Address Bar and hit Enter. Scroll down until you see the listing for Compact Navigation. Enable it and let the browser restart to gain access to the feature. Once the browser has restarted right click on one of the tabs and select Hide the toolbar from the Context Menu.
The address bar is displayed on top of the navigation controls and buttons for managing tabs, sharing, and other app settings.
Switch to full-screen mode Another simple way to hide the URL bar in Chrome is to go full-screen by pressing F11 or Fn + F11 , depending on whether the Function (Fn) key is locked or unlocked. Remember that this method will hide the tabs as well and only open the current tab in full-screen mode.
Maybe you can set the minheight on the body bigger. 480px screen height in vertical mode + 60px address bar height = 540px.
Example:
body { min-height:540px; } body[orient="portrait"] { min-height:540px; } body[orient="landscape"] { min-height:400px; }
iPhone:
Works only if the mobile "app" is added to the homescreen (through the plus-icon -> add to homescreen)
<meta name="apple-mobile-web-app-capable" content="yes" />
I have no experience with other mobile OS'es, but a quick Google-search for hide browser url bar android resulted in a similar solution to yours, with a window.scrollTo.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With