Skip to content

Instantly share code, notes, and snippets.

@scottjehl
Created August 31, 2011 11:42
Show Gist options
  • Save scottjehl/1183357 to your computer and use it in GitHub Desktop.
Save scottjehl/1183357 to your computer and use it in GitHub Desktop.
Normalized hide address bar for iOS & Android
/*
* Normalized hide address bar for iOS & Android
* (c) Scott Jehl, scottjehl.com
* MIT License
*/
(function( win ){
var doc = win.document;
// If there's a hash, or addEventListener is undefined, stop here
if( !location.hash && win.addEventListener ){
//scroll to 1
window.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);
} );
}
})( this );
@ambientp
Copy link

ambientp commented Dec 9, 2011

Hi @Fresheyeball
I copy/pasted it just before the and it doesn't seem to be working.
I'm kinda new to all this, is there anything else I need to do to get it to work?
Also I'm testing this on an itouch. Not sure if that makes a difference or not

@Fresheyeball
Copy link

@ambientp can I get the url of your site? You can contact me on skype at skype id = 'fresheyeball'

@ambientp
Copy link

ambientp commented Dec 10, 2011 via email

@Fresheyeball
Copy link

@ambientp, I just tested your site on ios4 iso5 and android 3. and the address bar got hidden.

@ambientp
Copy link

ambientp commented Jan 3, 2012 via email

@archerallstars
Copy link

Thanks for the code. At first I tested and the code didn't work, I though it has to be something wrong. And just to note that, if your site contains an event that use jQuery scrollTop to y 0, it will override the code and cause it not to work on Android. So, I added +1 to my scrollTop value and it solved the issue completely.

@capdragon
Copy link

Not working :/

@archerallstars
Copy link

It's working perfectly(not test on ICS yet). The other thing that it won't work is your page is too shot.

@scottjehl
Copy link
Author

There's a repo here with more recent code, fwiw https://github.com/scottjehl/Hide-Address-Bar

@chriv
Copy link

chriv commented Apr 30, 2012

I swear, I cannot get any version of this to work. window.scrollTo(0,0) ; window.scrollTo(0,1) ; hideAddressBar() above ; hideaddressbar.js ; anything. here's where I'm trying it: https://beta.buildingindustryservices.com/payapp . Cannot imagine what I'm doing wrong. I keep uploading code to my server and I test it in four browsers:

  • Android (ICS) Browser (usually fails)
  • Android Dolphin HD Browser (only scrolls 1 pixel or nothing)
  • Android Chrome Beta Browser (doesn't scroll)
  • Android FireFox Browser (not beta) (worse than doesn't scroll - extends page too far)
    I don't have an iPhone to test on.
    I'm open to suggestions. I've been tweaking code to do this for 2 months (no, it's not the only thing I've been coding).

@hedefalk
Copy link

hedefalk commented Mar 1, 2013

Does this work in ios6? I had a simple window.scrollTo( 0, 1 ); that works in <= ios5 but not in ios6.

Thanks, Viktor

@NeroLang
Copy link

NeroLang commented May 6, 2014

it doesn't work.

@MichelArendt
Copy link

Apparently, not working properly anymore. It adds extra padding...

@harshamv
Copy link

does this work?

@FabianGabor
Copy link

It doesn't work in Android v4.x

@frontenddeveloping
Copy link

This is outdated. Thanks for this snippet. Works on iOS 7- only.

@yazeryanski
Copy link

2020 | That does not work (

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment