jquery阻止正常滚动和动画

Question

基本上我正在寻找一种在该网站上重新创建滚动功能的方法

http://beoplay.com/Products/BeoplayA9

问题是，当您开始滚动时，页面不会像往常一样滚动，但它会注意到您的滚动命令并动画垂直页面移动。有人知道如何在 jQuery 中重新创建该功能吗？

我认为这将是关于e.preventDefault();当$(window).scroll()然后执行滑动当前div的动画根据窗口的高度向上或向下。

Answer 1

好的，我做了一些可以满足您需求的东西:

var page = $("div.page");
var heights = [];
var index = 0;

page.each(function(i){
    heights[i] = $(this).offset().top;
});

$(document).on('DOMMouseScroll mousewheel', function(e, delta) {
    // normalize the wheel delta
    delta = delta || -e.originalEvent.detail / 3 || e.originalEvent.wheelDelta / 120;

    // do nothing if is already animating
    if($("html,body").is(":animated")) return false;

    // increase the page index based on wheel direction
    index = (index-delta) % (heights.length);

    // animate the scrolling
    $("html,body").stop().animate({
        scrollTop: heights[index]
    }, 1000);

    e.preventDefault();
});

http://jsfiddle.net/ARTsinn/7TKmc/2/