CSS3转换导致非常奇怪的window.scrollY行为

Question

我在构建的Wordpress网站上使用了一些较新的CSS，包括vh使视图高度的部分，以及transform-z的视差滚动效果。

我注意到虽然页面正常滚动，但无论我在页面window.scrollY或$(window).scrollTop()上的哪个位置都会返回0。也就是说，除非我尝试滚动超出页面边界，在这种情况下，它确实开始返回实际值（在Mac上弹性滚动）。

事实上，$(window).scroll()的事件监听器甚至无法触发，直到我点击页面边界。

还有其他人遇到过这样的事吗？我甚至不知道从哪里开始调试...我正在滚动时将$(window).scrollTop()记录到控制台以解决问题。

http://dev.nickforddesign.com/resonator/category/portfolio/

Answer 1

我认为您应该删除main的溢出语句，并将其移至部分。

section { 
    overflow: hidden;
}
main {
    perspective: 1px;
    height: 100vh;
}

然后您的活动即会开始，您将能够通过js更改每个部分scrollTop。

Answer 2

您是否尝试将$(window).scrollTop()封装在.on()方法中？

$(window).on('scroll', function() {
   $(this).scrollTop();
});