Skip to content

Instantly share code, notes, and snippets.

@ffdead

ffdead/reflowFixedPositions.js

Created August 27, 2012 08:46
Show Gist options
  • Star 5 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save ffdead/3486736 to your computer and use it in GitHub Desktop.
Save ffdead/3486736 to your computer and use it in GitHub Desktop.
Download ZIP
Solved position: fixed scrollTo() bug on iOS
Raw
reflowFixedPositions.js
/**
* Causes the browser to reflow all elements on the page.
* Fix for the iOS5 bug where fixed positioned elements are
* unavailable after programmatically calling window.scrollTo()
*
* @autor david@14islands.com
*/
reflowFixedPositions: function () {
document.documentElement.style.paddingRight = '1px';
setTimeout(function () {
document.documentElement.style.paddingRight = '';
}, 0);
},
@ffdead
Copy link
Author

ffdead commented Aug 27, 2012

Inspired by http://stackoverflow.com/questions/11297641/mobile-webkit-reflow-issue/11479118#11479118

  • adding width:101% div didn't work well with absolutely positioned content
  • modifying document width works, however, it causes right aligned elements to shift position

Using rightPadding has same effect as width but with no layout side effects

@sanex3339
Copy link

any solution for IOS8 safari? padding, width and other tricks not help me, only
var scrollPos = window.pageYOffset;
var tempScrollPos = scrollPos - 1;
$('body, html').scrollTop(tempScrollPos).animate({scrollTop: scrollPos}, 1);

But i doesnt like that solution.

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