使用jquery滚动到元素

使用jquery滚动到元素,jquery,scroll,Jquery,Scroll,jquery中有scrollTop方法,但我需要scrollBottom方法 我的用例是,用户点击元素的右上角,在网站的深处有一个元素#test,我想滚动到底部,这样用户就可以看到这个元素 你会怎么做?我知道有一个jquery scrollTo插件,推荐使用吗?这么简单的任务 更新 我用一个代码示例更新了我的问题,该示例部分取自上述“jquery滚动到元素”重复投票: var container = $('#view'); var scrollTo = $('#test'); containe

jquery中有scrollTop方法,但我需要scrollBottom方法

我的用例是,用户点击元素的右上角,在网站的深处有一个元素#test,我想滚动到底部,这样用户就可以看到这个元素

你会怎么做?我知道有一个jquery scrollTo插件,推荐使用吗?这么简单的任务

更新

我用一个代码示例更新了我的问题,该示例部分取自上述“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() });
$("html, body").animate({ scrollTop: $("#myID").scrollTop() }, 1000);
如果要滚动到特定ID,可以使用以下选项:

$("html, body").animate({ scrollTop: $(document).height()-$(window).height() });
$("html, body").animate({ scrollTop: $("#myID").scrollTop() }, 1000);
HTML

跟随这把小提琴,看一看真实的例子


我希望,这将对您的需求进行排序。

查看我的十行jQuery插件(未压缩)。它可以做你想做的事情,而且更简单

作为jQuery实用程序:

$.scrollTo(to,duration,func)

或者作为jQuery原型的扩展:

$(“选择器”).scrollTo(持续时间,func)

第一种形式中的
to
部分可以接受大量像素、jQuery选择器字符串、
end
word(滚动页面末尾)、元素或jQuery对象


希望它能帮助别人。

可能的重复别忘了在页面中包含jquery这不是我的用例。我不想向下滚动到最底部/最后一端,因为高度为2500px时,你使用的按钮2可能在顶部:1000px,当我点击按钮1时,我看不到按钮2,因为我在底部太低了。然后你错误地理解了它。我想滚动到页面底部方向的元素。至少我想向下滚动而不是向上滚动。@Pascal然后检查第二行代码。。。这会把你带到那个分区的顶端
$('.Top').click(function () {
   $('html, body').animate({scrollTop:$(document).height()}, 'slow');
   return false;
   });

   $('.Link').click(function () {
   $('html, body').animate({scrollTop:0}, 'slow');
   return false;
   });
$("your element on which, if user clicks the scrolling shall proceed").click(function() {
  $("html, body").animate({ scrollTop: $(document).height() }, "slow");
  return false;
});