Created
September 16, 2011 08:50
-
-
Save bobslaede/1221602 to your computer and use it in GitHub Desktop.
Modernizr position fixed check
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
;(function(Modernizr, window) { | |
Modernizr.addTest('positionfixed', function () { | |
var test = document.createElement('div'), | |
control = test.cloneNode(false), | |
fake = false, | |
root = document.body || (function () { | |
fake = true; | |
return document.documentElement.appendChild(document.createElement('body')); | |
}()); | |
var oldCssText = root.style.cssText; | |
root.style.cssText = 'padding:0;margin:0'; | |
test.style.cssText = 'position:fixed;top:42px'; | |
root.appendChild(test); | |
root.appendChild(control); | |
var ret = test.offsetTop !== control.offsetTop; | |
root.removeChild(test); | |
root.removeChild(control); | |
root.style.cssText = oldCssText; | |
if (fake) { | |
document.documentElement.removeChild(root); | |
} | |
return ret; | |
}); | |
Modernizr.addTest('iospositionfixed', function () { | |
var test = document.createElement('div'), | |
ret, | |
fake = false, | |
root = document.body || (function () { | |
fake = true; | |
return document.documentElement.appendChild(document.createElement('body')); | |
}()); | |
if (typeof document.body.scrollIntoViewIfNeeded === 'function') { | |
var oldCssText = root.style.cssText, | |
testScrollTop = 20, | |
originalScrollTop = window.pageYOffset; | |
root.appendChild(test); | |
test.style.cssText = 'position:fixed;top:0px;height:10px;'; | |
root.style.height="3000px"; | |
/* avoided hoisting for clarity */ | |
var testScroll = function() { | |
if (ret === undefined) { | |
test.scrollIntoViewIfNeeded(); | |
if (window.pageYOffset === testScrollTop) { | |
ret = true; | |
} else { | |
ret = false; | |
} | |
} | |
window.removeEventListener('scroll', testScroll, false); | |
} | |
window.addEventListener('scroll', testScrollTop, false); | |
window.setTimeout(testScroll, 20); // ios 4 does'nt publish the scroll event on scrollto | |
window.scrollTo(0, testScrollTop); | |
testScroll(); | |
root.removeChild(test); | |
root.style.cssText = oldCssText; | |
window.scrollTo(0, originalScrollTop); | |
} else { | |
ret = Modernizr.positionfixed; // firefox and IE doesnt have document.body.scrollIntoViewIfNeeded, so we test with the original modernizr test | |
} | |
if (fake) { | |
document.documentElement.removeChild(root); | |
} | |
return ret; | |
}); | |
})(Modernizr, window); |
Hi @jtangelder.
It's worth noting that it looks as though with the recent release of OS 10 the UA string will match the regex ua.match(/(iphone|ipad|ipod).+(OS [0-4])/i)
eg iPhone OS 10_3_1
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
@KrisJanssen - Thank you for logging this. I have just debugged our app on Online Library and tracked it down to this piece of code. It looks as though the iospositionfixed test is creating a duplicate body element with the 3000px height which is why we are seeing a big blank space before the actual content - we are currently patching.