有没有办法,滚动类似于scrollTop,只是从底部?

时间:2010-11-20 17:30:11

标签: jquery html

我们都知道从视口顶部滚动到某个位置的解决方案:

$("html, body").animate({scrollTop:240}, 'fast');

有没有办法滚动类似于scrollTop,只是从视口的底部?

我想要做的事情:在点击事件中,页面应滚动到正文中任何位置的div,当div到达视口底部时,它应该停止滚动,完全可见。这可能吗?

3 个答案:

答案 0 :(得分:2)

您需要使用.offset().top的组合,这是元素与文档顶部的偏移量,$(window).height(),这是视口的高度:

var b = $('myEle');
$('html').animate({scrollTop: b.offset().top - $(window).height() + b.outerHeight()});

滚动到经常使用的.offset().top位置将使块移动到屏幕顶部,因此我们只需减去视口的高度并添加对象的高度以使其移动到用户视口底部的位置。

在此处查看简单演示:http://www.jsfiddle.net/yijiang/Xkj9s/

答案 1 :(得分:1)

有一个scrollHeight属性可以告诉您可以滚动的金额。因此,如果您想从底部滚动240像素,请使用scrollHeight - 240,例如:

var elem = $('html');
elem.animate({ scrollTop: elem[0].scrollHeight - 240 }, 'fast');

Example on JSBin

答案 2 :(得分:0)