ブラウザに表示されている下の箇所までスクロールさせたい

jqueryを使い、スクロール機能を作成していています。
topに戻るボタンをクリックし、画面topまで戻ることはできました。
次に、下がるボタンを押した時に、ブラウザ画面表示の下の部分まで下がるようにしたいと思っています。

var scrollHeight = $(document).height();
        var scrollPosition = $(window).height() + $(window).scrollTop();
        if ((scrollHeight - scrollPosition) / scrollHeight === 0) {
          //一番下まで来た時
        }

上記の記述で、高さを取得することや、一番下に来た時の判定はできたのですが...
ブラウザで表示されている部分より、まだ下に要素があった場合、下がるボタンを押した時に
表示されていた一番下の高さが、今度は一番上にきて表示されるようにしたいと考えていますが、これは可能ですか？
ご教示ください。

<body>

<div id="header">
</div>



<div class="bg">
  <div class="container">
    <div class="bottom-on page-done clearfix"><a href="#">▼<span class="bottom-btn-text font-size0">Done</span></a></div>
    <div class="container-fluid clearfix">

    　<div class="alert alert-success alert-no-result" role="alert"></div>
      <div class="back-btn alert-btn">
        <a href="./" class="square_btn">戻る</a>
      </div>
      <div class="arcive size01" id="test"></div>

    </div>


    <div class="top-on pagetop clearfix"><a href="#header">▲<span class="top-btn-text font-size0">Top</span></a></div>

  </div><!-- /container -->
</div><!-- /bg -->

<footer id="footer">
</footer>
    
</body>

  //スクロール
  $(document).ready(function() {

    var pagetop = $('.pagetop');
    var pagedone = $('.page-done');


      $(window).scroll(function () {

         if ($(this).scrollTop() > 100) {
              pagetop.fadeIn();
              pagedone.fadeOut();
         } else {
              pagetop.fadeOut();
              pagedone.fadeIn();
              }
         });

         //下に移動ボタン
         pagedone.click(function () {
             
         });

         //topに戻るボタン
         pagetop.click(function () {
             $('body, html').animate({ scrollTop: 0 }, 500);
              return false;
         });
  });

行動規範の内容に同意します

回答1件

ベストアンサー

えっと、もうほとんどできていると思うのですが、どこがわからなかったのでしょう？

JavaScript
1  // 下に移動ボタン
2  pagedone.click(function(event) {
3    var scrollPosition = $(window).height() + $(window).scrollTop();
4    $('body,html').animate({ scrollTop: scrollPosition }, 500);
5    event.preventDefault();
6    return false;
7  });