Question

jquery中有scrollTop方法，但我想要一个scrollBottom方法。

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

你会怎么做？我知道有一个jquery scrollTo插件是否推荐使用？这么简单的任务？...

更新

我已经使用代码示例更新了我的问题，该代码示例部分来自上面的'jquery scroll to element'dupe vote：

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但可能问题是它没有最高价值......我该如何解决？

Answer 1

你可以试试这个

var p = $("#test");
var offset = p.offset();
$("body").scrollTop(offset.top);

Answer 2

我从你的问题中理解的是，你想滚动到页面的底部，所以你可以使用它：

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

如果你想滚动到特定的ID，你可以使用它：

$("html, body").animate({ scrollTop: $("#myID").scrollTop() }, 1000);

Answer 3

$(window).load(function() {
  $("html, body").animate({ scrollTop: $(document).height() }, 2000);
});

Answer 4

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;
   });

关注这个小提琴，看看实例

http://jsfiddle.net/Ur3Dv/

Answer 5

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

我希望，这可以满足您的要求。

Answer 6

查看我的十行jQuery插件（未压缩）。它做你想做的事情，虽然它很简单

https://github.com/Samer-Al-iraqi/Simple-jQuery.scrollTo

作为jQuery实用程序：

ActionListener listener = new ActionListener() { public void actionPerformed(ActionEvent e) { textfield.get(button.indexOf(e.getSource())).setText(""); } }; for (int i = 0; i < 10; i++) { button.get(i).addActionListener(listener); }

或者作为jQuery原型的扩展：

$.scrollTo(to, duration, func);

第一种形式的$('selector').scrollTo(duration, func);部分可以接受多个像素，jQuery选择器字符串，to字（用于滚动页面末尾），元素或jQuery对象。

希望它会对某人有所帮助。

使用jquery滚动到元素

6 个答案: