用户界面使用JQuery自动滚动到窗口部分

Question

我创建了一个完全适合Android Tab 2屏幕的HTML 5应用页面。每个部分都与视口的大小完全相同。它从上到下滚动，共有5个部分。

如果用户发现自己位于两个部分之间，我想使用Jquery让浏览器自动滚动到该部分的顶部。

我看到了一个我想在这里做的例子： http://www.twenty8twelve.com/

看看你是如何在一个部分中缩小30像素（或其他什么），在一秒之后，区域（部分）动画到该部分的顶部。

Answer 1

他们正在使用一些自定义的jScroll mojo来完成效果。我建议使用这样的简单插件来模拟这种行为。

效果示例： http://nick-jonas.github.com/windows/

github回购：https://github.com/nick-jonas/nick-jonas.github.com/tree/master/windows

Answer 2

您可以使用库我使用选项autoScrolling:false创建的fullpage.js库来创建普通滚动而不是自动滚动。

Example online

默认情况下，fullpage.js使用选项fitToSection:true来创建您正在寻找的效果。

此外，您还可以使用其他一些功能，例如在URL中使用可链接的锚点，回调，菜单，导航项目符号等。