如何防止页面在浏览器中“跳跃”

什么是“跳动” - 在此页面上向右滚动到顶部，然后如果您使用的是Mac，则使用两个手指并向上滚动更多...页面将向上滚动（页面向下移动），揭开灰色区域并在您的手指离开触摸板后反弹回来。如何防止页面在浏览器中“跳跃”

问题是我该如何防止CSS或JavaScript引起的这种“颠簸”效应？

我知道这是可能的，因为如果你去facebook或pinterest并点击图片，你会得到一个灯箱。在这个灯箱“模式”中，你不会得到这种“抽搐”效果。

我最初认为这是关于灯箱或css固定定位，但即使在http://lokeshdhakar.com/projects/lightbox2/“模式”它仍然是“混蛋”。 fb和pinterest是如何做到的？

ps。使用铬或Safari浏览器。 Firefox没有这个效果。

2012-09-05 PK.

这是一个UI功能，让人们知道他们的滚动已被识别，但他们在文档的末尾。为什么要混淆这样的标准功能？ – Quentin

quentin我明白你的观点，但我不认为我们应该在这里讨论“为什么”。我问，因为脸谱和pinterest做到了，我喜欢从技术上知道它是如何完成的。 –

Facebook似乎通过在图片显示时在文档正文上设置CSS属性“overflow：hidden”来实现此目的。我只是通过将下面的CSS添加到HTML文件中来测试它，并且反弹滚动被禁用。

<style type="text/css"> 
body { 
    overflow: hidden; 
} 
</style>

当然，这会阻止你的页面滚动。我同意昆汀，这是标准的用户界面行为，除非你有充分的理由，否则不应该改变它。

2012-09-05 09:07:15 Ben

谢谢。但pinterest能够实现禁用反弹，但仍然能够滚动页面。任何想法他们如何做到这一点？ –

回答