jQuery（或CSS3）在滚动内容部分之间切换

Question

我希望你能指引我朝着正确的方向发展。

我想复制导航，类似于一个本网站上： http://vsamarehorosho.ru/

基本上，这个想法是，你不要让用户拥有该网站的不同部分是在屏幕上与此同时。 因此，如果该部分大于屏幕，它会滚动，直到到达该部分的底部。如果您进一步滚动，则跳转到下一部分。

如果部分小于屏幕尺寸，则会在顶部看到主要部分，并在底部看到下一部分的一部分，但是当您尝试滚动时，下一部分会跳到顶部，然后跳到顶部只有当这个尺寸小于屏幕尺寸时才显示在底部。

在这个例子中，所有的幻灯片都是100％的高度，但这并不总是可以实现的。

希望你能帮助我。

Answer 1

将高度为100％的所有部分都包裹在div中;

这种方式， 如果部分高度低于100％，包装将有助于确保只有一个部分显示在页面上。 如果截面高度超过100％，滚动可能发生在包装上，而不是在页面上。

Answer 2

尝试使用固定的像素高度。确定“最高”div的必要高度，并将所有div设置为该高度。这可能会在某些div上留下一些空格，但会确保一次只能看到一个div。

然后，您可以使用在线提供的许多“滚动到”脚本之一，并为每个单独的部分创建导航链接。 Ariel Flesler的scrollto.js就是一个很好的例子。 http://flesler.com/jquery/scrollTo/

兆焦耳 5150设计

Answer 3

我做了一个库，可以使之成为可能。 （fullpage.js）

它甚至适用于较小的部分。