Created
July 25, 2015 01:40
-
-
Save matpratta/b2b7e04ce731245b09c2 to your computer and use it in GitHub Desktop.
Fixes page scroll "jumping" on mobile devices with auto-hiding address bar, when it contains a 100% height element.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| /* 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