我的页面上有一个div:
<div id='div1' style='overflow:scroll;overflow-x:hidden;max-height:200px;'></div>
我怎样才能使div滚动到div的底部??不是页面,只是DIV。
我的页面上有一个div:
<div id='div1' style='overflow:scroll;overflow-x:hidden;max-height:200px;'></div>
我怎样才能使div滚动到div的底部??不是页面,只是DIV。
当前回答
$(document).ready(function() {
let width = $(window).width();
let element = $("#YourId");
let positionFromTop = element.offset().top + element.prop("scrollHeight");
$("html, body").animate({
scrollTop: Math.abs($(window).height() - positionFromTop)
}, 500);
});
其他回答
jquery的动画(版本> 2.0)
var d = $('#div1');
d.animate({ scrollTop: d.prop('scrollHeight') }, 1000);
$(window).load(function() {
$("html, body").animate({ scrollTop: $(document).height() }, 1000);
});
这将获取页面的高度,并在窗口加载后向下滚动页面。一旦页面准备好,将1000更改为您需要的任何速度。
你可以使用下面的代码滚动到底部的div页面加载。
$(document).ready(function(){
$('div').scrollTop($('div').scrollHeight);
});
你可以检查scrollHeight和clientHeight与scrollTop滚动到div底部像下面的代码。
$ (' # div ')。滚动(函数(事件){ if ((parseInt($('#div')[0].scrollHeight) - parseInt(this.clientHeight)) == parseInt($('#div').scrollTop())) { Console.log("这是div的滚动底部"); } });
我在这里看到的所有答案,包括目前“被接受”的答案,实际上都是错误的,因为他们设置了:
scrollTop = scrollHeight
而正确的方法是设置:
scrollTop = scrollHeight - clientHeight
换句话说:
$('#div1').scrollTop($('#div1')[0].scrollHeight - $('#div1')[0].clientHeight);
或动画:
$("#div1").animate({
scrollTop: $('#div1')[0].scrollHeight - $('#div1')[0].clientHeight
}, 1000);