Question

我有一个DIV，它设置了一个overflow-y滚动。

.scrolling-div {
width: 85%;
height: 200px;
overflow-y: scroll;
}

假设我在这个div中有一堆内容，我希望它一直滚动到pageload的div底部。我实际上想要看到滚动的动画（所以div将从顶部开始，但我想看到它滚动到底部）。

如何使用Javascript，Jquery或纯CSS创建它？我还希望能够控制滚动动画的速度。

Answer 1

$(function() {
  var wtf    = $('#scroll');
  var height = wtf[0].scrollHeight;
  wtf.scrollTop(height);
});

#scroll {
   width: 200px;
   height: 300px;
   overflow-y: scroll;
 }

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

Answer 2

您可以使用jquery＆＃39; s animate：

$('.scrolling-div').animate({ 
   scrollTop: $('.scrolling-div').prop('scrollHeight')
}, 1000);

查看工作示例here。

Scrollable DIV，我想创建一个在pageload上滚动到div底部的动画

2 个答案: