jQueryを利用して、ページ内のコンテンツ(テキストや画像)をslideToggleで開閉式にしたいと考えています。
[閉じる]ボタンをクリックした歳に開閉式コンテンツ(#readmore-wrap)のトップにアニメーションで移動させたいと思っています。
私の書いたjsだと[続きを読む]をクリックした歳にも#readmore-wrapのトップに移動してしまいます。
希望としては以下になります。
javascripに明るくないため見当違いのコードかもしれませんが、ご意見いただければ幸いです。

  • [続きを読む]をクリックした歳はそのままコンテンツがslideToggleで表示。
  • [閉じる]ボタンをクリックした歳にはコンテンツが閉じるのと同時に開閉式コンテンツ(#readmore-wrap)のトップにアニメーションで移動

  var position = $("#readmore-btn-common").offset().top;
  jQuery(document).ready(function($){
    jQuery('#readmore-btn-common').click(function () {
      $("html,body").animate({
          scrollTop : position
      }, {
          queue : false
      });
        jQuery('#readmore-wrap').slideToggle(1000,function(){
          if (jQuery(this).is(':hidden')) {
            jQuery('#readmore-btn-common').html('<span id="readmore-btn-open" >続きを読む</span>');
          } else {
            jQuery('#readmore-btn-common').html('<span id="readmore-btn-close">閉じる</span>');
          }
        });
    });
  });
#readmore-wrap{
      display: none;
  }
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<!-- 開閉式コンテンツ -->
<div id="readmore-wrap">
  <!-- コンテンツの中身 -->
</div>
 <!-- /開閉式コンテンツ -->
<span id="readmore-btn-common"><span id="readmore-btn-open">続きをよむ</span></span>