jQuery 显示隐藏的内容，然后自动滚动到内容的中间

Question

我设置了一个按钮，单击该按钮会展开页面。代码如下：

/*Source:http://rpardz.com/blog/show-hide-content-jquery-tutorial*/

jQuery('.open-content').hide().before('<div class="container_12"><a href="#" id="toggle-content" class="button"><div id="expand-button" ></div></a></div><div id="toggle-top" style="width:100%"></div>');
jQuery('a#toggle-content').click(function() {
    jQuery('.open-content').slideToggle(1000);
    return false;
});

如您所见，它运行良好：隐藏：http://cl.ly/101v0N0W1z2D2e0x3a0j 扩展：http://cl.ly/1Z2Q1d3Y2z2X3G1j1v2G

注意（参见图片侧面的滚动条）页面底部如何展开以显示更多内容；我想不通的是如何使页面在页面完成扩展后自动滚动到现在可见内容的底部..

我使用这个标准脚本来平滑滚动到页面上的位置..

/*Source: http://goo.gl/DaRfF */
jQuery(document).ready(function($) {

$(".scroll").click(function(event){     
    event.preventDefault();
    $('html,body').animate({scrollTop:$(this.hash).offset().top}, 500);
});

});

但我看不到如何集成它，以便它在完成扩展后自动滚动到内容的底部。非常感谢所有帮助，谢谢！

Answer 1

这样的事情怎么样？

jQuery('.open-content').slideToggle(1000, function(){
   var offset = jQuery('.open-content').offset();
   var y = offset.top + jQuery('.open-content').height();
   var wheight = $(window).height()
   var scroll = y - wheight;
   $(document).animate({scrollTop:scroll}, 500);
});