javascript - 使用 javascript 在页面底部显示一个元素

Question

在留言簿中，我在页面底部有一个按钮，该按钮在单击时显示输入表单：

$("a#showform").click(function(){ 
  $(this).hide();
  $("div#post").show("slow");
});

问题是出现的表单在当前视口之外，只有手动滚动才能使表单对用户可见。我无法从网上找到任何解决方案，但这一定是一个非常普遍的问题。没有“坚持到底”或类似的jquery命令吗？

接下来是：我在整个页面上使用nanoScroller，所以正常的向下滚动方法在这里不起作用。nanoScroller 有一个方法 scroll:"bottom" 但它并不平滑......

非常感谢，托尼

Answer 1

每当您的网页展开时，您都可以轻松滚动到页面底部：

 $("a#showform").click(function(){ 
        $(this).hide();
        $("div#post").show("slow");
        $('html, body').animate({
                                     scrollTop:$(document).height()
                                }, 'slow');
    });

您可以将.animate()的“慢”设置为以毫秒为单位的任何速度。

jsFiddle

Answer 2

只需调整函数内的滚动

$("a#showform").click(function(){ 
  $(this).hide();
  $("div#post").show("slow");
  /* $(scroll magically to #post) */
  $("div#post").nanoScroller({ scroll: 'top' });
});

Answer 3

如果您不关心包含其他元素的帖子项目，您可能希望使用 css 来解决此问题：

div#post {
  position: fixed;
  bottom: 0px;
}