Question

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

e.g。当我向上拖动对象时，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/

Answer 1

我想我找到了答案，我修改了animate（）函数。

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

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

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

在draggable中的stop（）方法中。

如何使用/通过可拖动对象上下滚动div

1 个答案: