I'm working on a mobile website which has "pages" that have div's which take up the screens full size and you can scroll between each one. The problem is, the window resizes whenever a user scrolls downward because the address bar hides. This causes problems when you scroll to the complete bottom and the address bar then hides.
Is it possible to have the address bar always show on mobile 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.
As discussed earlier, hitting the F11 or Fn + F11 key will automatically switch Chrome to full-screen mode to auto hide the address bar, and the bookmarks and tabs.
16384.0 you can hide the address bar by setting location=no in the window. open features. Save this answer.
You can wrap your HTML with div
and do something like this: http://jsfiddle.net/DerekL/Fhe2x/show
$("html, body, #wrapper").css({
height: $(window).height()
});
It works on Android and iOS.
The simplest way to achieve this is to scroll in a container, rather than scrolling the document.
E.g.:
<html><body>
<div id="scrollable-content"> ... all your content here ... </div>
</body></html>
html, body {
height: 100%;
}
#scrollable-content {
height: 100%;
overflow-y: scroll;
}
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