Menu
I'm trying to detect, in a future-proof and device-independent way, when the address bar in the iPhone browser is showing. This is the toolbar that is shown at the top in order to display the URL. It can be hidden by calling:
window.scrollTo(0, 0)
What I'd like to do, is detect when it's being show (thus reducing the available viewing space) and set a timer to hide it again a second or so later. Any more frequent than that and it'll be quite annoying since users won't be able to get to the address bar.
I've tried checking window.pageYOffset, unfortunately, this returns zero if any part of the url bar is visible.
I don't want to hard code any dimensions on the iPhone and check those against the current viewport size. It's too fragile.
Anyone know a solution here?
510
Open the Settings app. Scroll down and tap Safari. Scroll down to the Tabs section and locate the option to switch between the Tab Bar and a Single Tab. Select Single Tab to move the Address Bar back to the top of the screen, or select Tab Bar to move it back to the bottom if you change your mind later on.
In the address bar at the foot of the screen, tap the AA icon at the left end. If you don't see it, swipe down to scroll up on the open web page and it should appear. From the popup menu, tap Show Top Address Bar. The address bar moves instantly.
1 – Select Safari from the top menu bar. 2 – Click Preferences. 3 – Select the Advanced tab. 4 – Check the box beside Show full website address.
An address bar is a component of an Internet browser which is used to input and show the address of a website. The address bar helps the user in navigation by allowing entry of an Internet Protocol address or the uniform resource locator of a website.
The window.innerHeight property is what you're looking for. This is the height of the actual content on the screen. It's significantly less when the toolbar at the top is visible, because there's less room for the content. There is a slight problem that I can't seem to figure out on my iPhone 4 - window.innerHeight sometimes returns 3 pixels less at certain scroll positions of the screen.
I've set up an example for you that does more or less what you asked, it should at least get you started:
http://jsfiddle.net/rUSEb/show/light (test it out on your iphone).
200
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
