jquery中有scrollTop方法,但我想要一个scrollBottom方法。
我的用例是,用户单击某个元素的右上角,并且在网站深处的某处有元素#test,我想滚动到底部,以便用户可以看到该元素。
你会怎么做?我知道有一个 jquery rollTo 插件,推荐使用吗?这么简单的任务?...
更新
我已经用代码示例更新了我的问题,该代码示例部分取自上面的“jquery 滚动到元素”欺骗投票:
var container = $('#view');
var scrollTo = $('#test');
container.animate({
scrollTop: scrollTo.offset().top - container.offset().top + container.scrollTop()
});
这些是我调试得到的值,滚动底部不起作用,屏幕静止不动。
scrollTo.offset().top => 0
container.offset().top => 274.75
container.scrollTop() => 0
我的元素 row1 是这样的,所以我猜在顶部 1500px 但问题可能是它没有顶部值...我该如何解决这个问题?
你可以试试这个
var p = $("#test");
var offset = p.offset();
$("body").scrollTop(offset.top);
我从你的问题中了解到的是,你想滚动到页面底部,所以你可以使用这个:
$("html, body").animate({ scrollTop: $(document).height()-$(window).height() });
如果您想滚动到特定 ID,您可以使用此:
$("html, body").animate({ scrollTop: $("#myID").scrollTop() }, 1000);
$(window).load(function() {
$("html, body").animate({ scrollTop: $(document).height() }, 2000);
});
$("your element on which, if user clicks the scrolling shall proceed").click(function() {
$("html, body").animate({ scrollTop: $(document).height() }, "slow");
return false;
});
我希望这能满足您的要求。
查看我的十行 jQuery 插件(未压缩)。它可以做你想做的事,甚至更多,尽管它很简单
https://github.com/Samer-Al-iraqi/Simple-jQuery.scrollTo
作为 jQuery 实用程序:
$.scrollTo(to, duration, func);
或作为 jQuery 原型的扩展:
$('selector').scrollTo(duration, func);
第一种形式中的
to
部分可以接受多个像素、jQuery 选择器字符串、end
单词(滚动页面末尾)、元素或 jQuery 对象。
希望它能帮助别人。
HTML
<body>
<div style="height:2500px">
<button class="Top" id="button1" >1</button>
</div>
<button class="Link" id="button1" >2</button>
</body>
脚本
$('.Top').click(function () {
$('html, body').animate({scrollTop:$(document).height()}, 'slow');
return false;
});
$('.Link').click(function () {
$('html, body').animate({scrollTop:0}, 'slow');
return false;
});
按照这个小提琴并查看实例