jQuery 使用两个按钮上下滚动 div

我有一组简单的两个按钮，当悬停时应该使 div 上下移动以模拟滚动效果：

$("#down").hover(function () {

    $('.scroll').animate({ "marginTop": "-=50px" }, "fast");

});

$("#up").hover(function () {

    $('.scroll').animate({ "marginTop": "+=50px" }, "fast");

});

但是我有两个问题：

1.）我需要它在到达终点时停止，然后隐藏按钮，以便他们知道他们已经到达终点

2.) 当用户将鼠标悬停时，它需要连续滚动，目前它仅在鼠标悬停时执行一次，然后在鼠标离开时再次运行。

3.) 如果内容不超过父元素高度，则隐藏两个按钮，因为我们不需要滚动它。

有人可以帮忙吗？

我在想也许 1 可以通过找出滚动面板的高度并判断其相对于其父元素的偏移来解决，该父元素保存它并创建框架视图？

Thanks

这段代码仍然需要一些调试，但你可以从中得到想法：

$(document).ready(function() {

    if ($('.content').height() > $('.container').height()) {
        $("#down").hover(function () {
            animateContent("down");
        }, function() { $('.content').stop(); });

        $("#up").hover(function () {
            animateContent("up");
        }, function() { $('.content').stop(); });
    }
});

function animateContent(direction) {  
    var animationOffset = $('.container').height() - $('.content').height();
    if (direction == 'up') {
        animationOffset = 0;
    }

    $('.content').animate({ "marginTop": animationOffset + "px" }, "fast");
}

Code: http://jsfiddle.net/a89DF/6/ http://jsfiddle.net/a89DF/6/