Question

我只想给scrollTop一个持续时间或时间滚动到0位置。而不仅仅是像某种动画一样滚动到顶部。这是我的代码随时可以查看它。提前谢谢，等待您的回复。

setTimeout(function(){
  $("#upup").on("click", function() {
    $("body").scrollTop(5);
  });
},6000);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button id="upup">scroll up baby</button>

Answer 1

以下是示例

$("#upup").on("click", function() {
 $('html, body').animate({
    scrollTop: 0
 }, 6000);
});

工作demo

希望有所帮助，

Answer 2

使用带动画的滚动（）。

＆＃13;

$("#upup").on("click", function() {
   $("body").stop().animate({scrollTop:0}, 1000, 'linear', function() { 
     alert("Finished ");
  });
});

＆＃13;

body{
  position:relative;
height:1000px;
}
#upup{
  position:absolute;
  bottom:0px;
  right:0px;
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div>
Scroll down

</div>
<button id="upup">scroll up baby</button>

＆＃13;

Answer 3

使用animate()滚动。

编辑：使用css构思按xyz扩展内容

＆＃13;

$("#upup").on("click", function() {
     $('html, body').animate({scrollTop:0}, 6000);
});

＆＃13;

body{
  position:relative;
  height:800px;
}
button{
  position:absolute;
  bottom:0;
  left:0;
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div>hello</div>
<button id="upup">scroll up baby</button>

＆＃13;

将持续时间设置为scrollTop（）

3 个答案: