单击时向下滚动功能

时间:2013-11-11 05:24:28

标签: javascript jquery

下面是我对scrollTop的代码。当我定位一个特定的像素时它工作正常,但我想向下滚动300px,而不是在点击时向下滚动某个div。有人可以帮忙吗?

<div id="button"></div>
<div1 style="height:300px;">img1</div>
<div2 style="height:300px;">img2</div>
<div3 style="height:300px;">img3</div>
<div4 style="height:300px;">img4</div>

$(function() {
$("#button").on("click", function() {
    $("html, body"). animate({"scrollTop":$().offset().top-300}, 1000);
    return false;
    });
}); 

3 个答案:

答案 0 :(得分:3)

尝试使用window.scrollBy(0,300);

答案 1 :(得分:1)

$().offset().top没有做任何事情。将其替换为window.scrollY

$(function() {
    $("#button").on("click", function() {
        $("body").animate({"scrollTop": window.scrollY-300}, 1000);
        return false;
    });
}); 

当我们谈论滚动时,也会出现负面影响,正面会下降,所以你可能想要添加300.

答案 2 :(得分:0)

我认为这是最好的方式。

var body = $('html, body');
$('#button').click(function() {
   var n = $(document).height() - $(window).height();
   body.stop().animate({scrollTop: n }, 1000, function() {
});
});