I'm having trouble with sizing a page. I'm resizing an image based on the height of the page. I don't want any scrolling on the page however on mobile devices the address bar is interfering. Sometimes the page gets the height without the address bar and puts in scroll bars other times it gets the height with the address bar and runs fine
Is there a way I can get the height of the page with the address bar? Or force it to show? (or force it to hide?)
Actually I had your problem, there are 2 ways to solve it, but they can't help you anywhere, on every browsers!!
WAY 1 : Check this has everything you need
http://www.html5rocks.com/en/mobile/fullscreen/
The Chrome team has recently implemented a feature that tells the browser to launch the page fullscreen when the user has added it to the home screen. It is similar to the iOS Safari model.
<meta name="mobile-web-app-capable" content="yes">
WAY 2: Using scroll and resize event on your window object to set height as same as your viewport anytime.