Created
November 26, 2013 03:09
-
-
Save bennyzhao/7652922 to your computer and use it in GitHub Desktop.
使用pointer-event:none创造60fps的滚动体验 From http://www.thecssninja.com/javascript/pointer-events-60fps
This file contains 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
/* | |
* 避免子对象覆盖body的设置,因此选择器提高了属性等级另外加了important | |
*/ | |
.disable-hover, | |
.disable-hover * { | |
pointer-events: none !important; | |
} |
This file contains 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
/* | |
* 原理是在滚动时将鼠标hover响应禁掉,在停止滚动时再加上 | |
*/ | |
var body = document.body, | |
timer; | |
window.addEventListener('scroll', function() { | |
clearTimeout(timer); | |
if(!body.classList.contains('disable-hover')) { | |
body.classList.add('disable-hover') | |
} | |
timer = setTimeout(function(){ | |
body.classList.remove('disable-hover') | |
},500); | |
}, false); |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment