Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
Fixes page scroll "jumping" on mobile devices with auto-hiding address bar, when it contains a 100% height element.
/* responsive.js (v. 1.0.0)
* by Matheus Pratta (matheus.io)
* Fixes the page scroll from "jumping" when the user scrolls from a mobile device which auto-hides the address bar.
* Note: for 100% height elements, instead of seeing a jump in the scroll, the user may see a jump on the element itself (mostly when it's vertically centered)
* Requires: jQuery
*/
$(document).ready(function() {
$(window)
.scroll(function() {
window._scroll_pos = $(window).scrollTop();
window._scroll_height = $(window).height();
})
.resize(function() {
var oH = parseInt(window._scroll_height);
var nH = parseInt($(window).height());
if(oH != nH) {
var offset = nH - oH;
$(window).scrollTop(window._scroll_pos + offset);
}
})
})
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.