jQuery鼠标滚动整个窗口每个滚动，像苹果iPhone 5网站

Question

有没有人知道如何在此网站中设置100％的滚动窗口？

我有一个垂直滚动的网站，每个＆lt; div>设置为li100％宽度和100＆amp;高度，我有一个锚系统，允许我直接从幻灯片滚动到另一个，使用每个＆lt; div ID＆gt;

我希望能够用鼠标滚轮做同样的事情，

http://www.apple.com/iphone-5c/

我的网站：

http://www.mb.nullame.com/

Answer 1

您可以使用 fullpage.js 。它完全符合您的要求。此外，它与旧浏览器兼容，如Internet Explorer 8,9 ...

• Demo
• Page

相当完整。您可以添加菜单，更改滚动缓动，速度，使用箭头移动，使其循环...

您可以从github repository下载。

Answer 2

我将网站主体用绝对定位100％x 100％（填充浏览器窗口）放入真实网站内容div并禁用滚动（溢出隐藏）然后通过听onmousewheel事件（和触摸触摸事件）设备）管理网站 - 我将每个“框架”的5套css规则设为过渡，使其看起来“流畅”。实际上它可以很好地与css一起播放 - 所以你实际上只需要改变一个类 - 这个div的类与真实站点通过视口“滚动”它。子元素可以具有父依赖css，如：

.pictureA{
  position:absolute;
  transition:all 0.5s;
}
.realBody_0 .pictureA{
  left:-50%;
}
.realBody_1 .pictureA{
  left:0;
}

之后我们说5个鼠标滚轮事件将内容类的div更改为realBody_1。 （ofc计数轮向上/向下以正确管理它）