我想创建一个拖动和滚动效果:

-> mouse down
-> drag and mouse move
-> the window will scroll according to the amount of mouse move
-> mouse up
-> scroll stops


现在,我遇到的问题是,当我拖动和移动时,窗口DOM元素会抖动。

我添加了一个偏移量检查,它可以缓解抖动问题,但是并没有解决。

谁能帮我?

以下是主要代码,完整的jsFiddle位于:http://jsfiddle.net/mifeng/sGvA4/1/

container.mousedown(function(e) {

    mouseX = e.pageX;
    mouseY = e.pageY;

    console.log("CON: " + conX + "," + conY);
    console.log("DOWN: " + mouseX + "," + mouseY);

    container.mousemove(function(e) {
        //console.log("INNER-DOWN: " + mouseX + "," + mouseY);

        offsetX = e.pageX - mouseX;
        offsetY = e.pageY - mouseY;

        // offset check
        if (offsetX > 10 || offsetX < -10 || offsetY > 10 || offsetY < -10) {
            conX -= offsetX;
            conY -= offsetY;

            window.scrollTo(conX, conY); // scrollTo

            mouseX = e.pageX;
            mouseY = e.pageY;
        }
    });
});

最佳答案

这里有2个插件可以满足您的需求。

http://archive.plugins.jquery.com/project/Dragscrollable

http://azoff.github.io/overscroll/

关于javascript - javascript如何创建流畅的拖动和滚动,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/12516216/

10-11 11:42