如何在mousedown事件下连续滚动div? [英] How to scroll div continuously on mousedown event?

问题描述

我有两个div和两个按钮:

I have two divs and two buttons:

<div id="container">
    <div id="items"></div>
</div>
<div id="up"></div>
<div id="down"></div>

如何连续滚动"#items"直到用户释放按钮? 我尝试使用jquery mousedown事件和动画功能，但无法使其正常工作.

How to continuously scroll '#items' until user releases the button? I tried using jquery mousedown event and animate function but couldn't make it to work.

$("#up").mousedown(function(){
$("#items").animate({"top": "+=10px"}, "fast");
})

上面的代码仅将div移动一次.我想要实现连续动画，直到释放按钮为止.感谢您的帮助！

The code above moves the div just once. I want to achieve continuous animation until the button is released. Thanks for your help!

推荐答案

请尝试以下操作:

var scrolling = false;

jQuery(function($){
    $("#up").mousedown(function(){
        scrolling = true;
        startScrolling($("#items"), "-=10px");
    }).mouseup(function(){
        scrolling = false;
    });
});

function startScrolling(obj, param)
{
    obj.animate({"top": param}, "fast", function(){
        if (scrolling)
        {
            startScrolling(obj, param);
        }
    });
}

这篇关于如何在mousedown事件下连续滚动div?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！