是否可以将jQuery效果.show（）与.scrollTop（）结合起来？

Question

以下是我想要合并的代码。 （我在Wordpress中这样做）

HTML

<button id="show">Show</button>
    <div id="extra-gallery" style="display:none">
    <h2 class="extra-gallery-title">Image Gallery</h2>

     (My Gallery loop)

<button id="hide">Hide</button>
</div>

jQuery我想结合

此

jQuery(document).ready(function(){
  jQuery("#hide").click(function(){
    jQuery("#extra-gallery").hide();
  });
  jQuery("#show").click(function(){
    jQuery("#extra-gallery").show( 700 );
  });
});

这个

jQuery("#show").click(function() {
    jQuery('html, body').animate({
        scrollTop: $("#hide").offset().top
    }, 2000);
}

预期结果

页面滚动到我的图库底部的#hide按钮或滚动，以便在单击#show按钮时图库位于页面的中心。

到目前为止

我昨天开始使用jQuery。我已经阅读了.hide（）,. show（）和scrollTop的Api文档，并且还在w3schools上播放了一些示例。在这个网站上有一些接近的示例答案，其中有jsfiddle示例设置。 目前我无法将示例转移到我的特定情况。

我有节目并且隐藏得很好。动画页面滚动到显示的内容将很好地完成此页面。我们非常感谢任何帮助，也欢迎更多阅读。

由于

Answer 1

感谢Kei和一个简单的代码片段，在下面的问题中伴随着一个jsfiddle，我能够调整并了解更多关于如何解决我的问题。

Jquery Show & ScrollTop (or ScrollTo)

这是我在wordpress网站上使用的工作代码，这里是jsfiddle

http://jsfiddle.net/earthling/Eu77V/1/

HTML

<button id="show">Show</button>
    <div id="extra-gallery" style="display:none">
    <h2 class="extra-gallery-title">Image Gallery</h2>

     (My Gallery loop)

<button id="hide">Hide</button>
</div>

的jQuery

jQuery(document).ready(function($){
    $("#show").click(function() {
        $("#extra-gallery").fadeIn(2000); 
        $('html, body').animate({
            scrollTop: $("#hide").offset().top
        }, 2000);
        return false;
    });
    $("#hide").click(function() {
        $('#extra-gallery').fadeOut();
        $('html, body').animate({
            scrollTop: 0
        }, 1000);
    });
});

请记住，如果你想使用它，它是为Wordpress编码的。