2

我想做的是上下控制/滚动一个div，它的移动取决于拖动的对象。此拖动对象在 jQuery 中属于可拖动类型。

例如，当我向上拖动对象时，div 向上滚动，反之亦然。

拖动的对象是操纵杆

$("#joystick").draggable({
        revert: true,
        containment: "parent",
        create: function(){
           $(this).data("startLeft",parseInt($(this).css("left")));
           $(this).data("startTop",parseInt($(this).css("top")));
        },
        start: function() {
            animating = true;
        },
        drag: function(event,ui){
            var rel_left = ui.position.left - parseInt($(this).data("startLeft"));
            var rel_top = ui.position.top - parseInt($(this).data("startTop"));
            animate(rel_top)
        },
        stop: function(){
            animating = false;
        },
        axis : "y"
    });

动画功能

var animate = function(r){
        $("#timeline").stop().animate({ scrollTop : r },2000,function(){
            if( animating ){
                animate(r);
            }
        })
    }

此外，这个 div 在加载时向下滚动

$("#timeline").animate({ scrollTop: $('#timeline')[0].scrollHeight}, 2000);

这里的例子：http: //jsfiddle.net/wq4Lg/

4

1 回答 1

1

我想我找到了答案，我修改了 animate() 函数。

var s = (r > 0) ? -10 : $("#timeline")[0].scrollHeight;

如果 r 为负数，如果为正数，我将上下滚动 div 并添加

$("#timeline").stop();

在可拖动的 stop() 方法中。

于 2013-08-21T17:52:49.233 回答