0

有谁知道我怎样才能像这个网站一样设置 100% 的窗口滚动？

我有一个垂直滚动的网站，每个 < div > 设置为 li100% 宽度和 100& 高度，我有一个锚系统，允许我使用每个 < div ID > 上的链接直接从一张幻灯片滚动到另一张幻灯片

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

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

我的网站：

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

4

2 回答 2

3

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

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

您可以从github 存储库下载它。

于 2013-10-02T22:21:17.887 回答
0

我会让网站主体具有绝对定位 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 向上/向下计数轮以正确管理它）

于 2013-10-02T20:16:39.477 回答