jquery - 使用 jquery 在按钮单击时上下滚动 div

Question

我正在尝试添加一个功能，根据按钮单击来上下滚动 div。我能够轻松地完成向下滚动部分，但被向上滚动部分卡住了，还有一个问题是场景，我将对此进行解释，

点击“向下”按钮。

如果我手动向下滚动并向下拖动滚动条。

现在，如果我再次单击“向下”按钮，滚动条将转到上一个位置，因为分配了滚动值的变量具有旧值，而不是检测滚动条的当前位置。我将添加一个jsfiddle 链接显示我的工作并粘贴代码。向上滚动选项我也可能做错了什么!!

http://jsfiddle.net/xEFq5/7/

var scrolled=0;

$(document).ready(function(){


$("#downClick").on("click" ,function(){
    scrolled=scrolled+300;

    $(".cover").animate({
        scrollTop:  scrolled
    });

});


$("#upClick").on("click" ,function(){
    scrolled=scrolled-300;

    $(".cover").animate({
        scrollBottom:  scrolled
    });

});


$(".clearValue").on("click" ,function(){
    scrolled=0;
});


});


<div class='header'><button id='upClick'>Go Up</button> <button id='downClick'>Go Down</button><button class='clearValue'>Clear Value</button> </div>


 <div class='cover'><div class='rightSection'></div></div>

还有没有一个好的插件具有此功能？

Answer 1

scrollBottom 不是 jQuery 中的方法。

更新的演示 - http://jsfiddle.net/xEFq5/10/

试试这个:

   $("#upClick").on("click" ,function(){
     scrolled=scrolled-300;
        $(".cover").animate({
          scrollTop:  scrolled
     });
   });