一滚滚一页是怎么做到的?

2014-07-04 22:45:18 +08:00
 yangkeao
就像http://lorem.in里面一样。

但我自己写的在滚动前都会颤抖。

怎么处理呢?

自己本来是这么写的:

height是窗口高度。

var getscroll = function() {
$.getScript("script/mousewheel.min.js");
$(window).bind('mousewheel', function(event, delta, deltaX, deltaY) {
if (deltaY < 0) {
t = $("body").scrollTop();
t = t - t % height;
$(document.body).animate({
'scrollTop': t + height
}, 700);
} else if (deltaY > 0) {
t = $("body").scrollTop();
t = t - t % height;
$(document.body).animate({
'scrollTop': t - height
}, 700);
}
});
}
getscroll();
3248 次点击
所在节点    问与答
6 条回复
emric
2014-07-05 03:57:17 +08:00
顺手做了一个, http://jsbin.com/wobuzoyi/1/edit?html,css,js,output
至于你的实现, 你确定 t 是理想值?
yangkeao
2014-07-05 10:20:53 +08:00
@emric
t = $("body").scrollTop();
t = t - t % height;
这样t就成了height的整倍。
lei286394973
2014-07-05 11:22:43 +08:00
https://github.com/alvarotrigo/fullPage.js
这个jquery插件应该适合你
emric
2014-07-05 14:01:44 +08:00
@yangkeao 其实你可以写一下测试, 例如 `1400-1400%500`, `1400%500` 返回的是 400 然后呢...
yangkeao
2014-07-05 15:26:33 +08:00
@emric 1000是500的两倍。
因为t是滑动后一瞬间产生的。
只会比高度的整倍多一点或少一点。

在你的例子中500是高度。

那么本来的高度如果是1000,向下滑,得到的t>1000
那么算出的t=1000.然后向下滑,滑倒t+height即1500的位置。

如果向上划,得到的t<1000,则t=500;
滑动到t即500;

只是开始的时候会抖动,我不知为什么。
emric
2015-01-14 15:09:10 +08:00
@yangkeao
翻回复的时候突然发现你之前有回复了我了... 抱歉啊.. 我没有看到..

---

scrollTop 的值低于 500 的时候就会有错误... 因为除余后得到的是0..

这是一个专为移动设备优化的页面(即为了让你能够在 Google 搜索结果里秒开这个页面),如果你希望参与 V2EX 社区的讨论,你可以继续到 V2EX 上打开本讨论主题的完整版本。

https://www.v2ex.com/t/121017

V2EX 是创意工作者们的社区,是一个分享自己正在做的有趣事物、交流想法,可以遇见新朋友甚至新机会的地方。

V2EX is a community of developers, designers and creative people.

© 2021 V2EX