V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
V2EX 提问指南
yangkeao
V2EX  ›  问与答

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

  •  
  •   yangkeao · 2014-07-04 22:45:18 +08:00 · 3236 次点击
    这是一个创建于 3774 天前的主题,其中的信息可能已经有所发展或是发生改变。
    就像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();
    6 条回复    2015-01-14 15:09:10 +08:00
    emric
        1
    emric  
       2014-07-05 03:57:17 +08:00
    顺手做了一个, http://jsbin.com/wobuzoyi/1/edit?html,css,js,output
    至于你的实现, 你确定 t 是理想值?
    yangkeao
        2
    yangkeao  
    OP
       2014-07-05 10:20:53 +08:00
    @emric
    t = $("body").scrollTop();
    t = t - t % height;
    这样t就成了height的整倍。
    lei286394973
        3
    lei286394973  
       2014-07-05 11:22:43 +08:00
    https://github.com/alvarotrigo/fullPage.js
    这个jquery插件应该适合你
    emric
        4
    emric  
       2014-07-05 14:01:44 +08:00
    @yangkeao 其实你可以写一下测试, 例如 `1400-1400%500`, `1400%500` 返回的是 400 然后呢...
    yangkeao
        5
    yangkeao  
    OP
       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
        6
    emric  
       2015-01-14 15:09:10 +08:00
    @yangkeao
    翻回复的时候突然发现你之前有回复了我了... 抱歉啊.. 我没有看到..

    ---

    scrollTop 的值低于 500 的时候就会有错误... 因为除余后得到的是0..
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   实用小工具   ·   930 人在线   最高记录 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 23ms · UTC 21:22 · PVG 05:22 · LAX 14:22 · JFK 17:22
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.