ページ先頭に戻るボタンの作成

<div id="page-top"><a href="#">TOPへ戻る</a></div>

/*--------------------------------
page top button
---------------------------------*/
#page-top {
    bottom: 20px;
    position: fixed;
    right: 0;
    z-index: 9999;
}

#page-top a {
    background: #FF4081;
    border-radius: 50%;
    color: #fff;
    display: block;
    font-size: 10px;
    height: 40px;
    line-height: 20px;
    padding: 10px 5px;
    text-decoration: none;
    text-align: center;
    width: 50px;
}

#page-top a:hover {
    text-decoration: none;
}

#page-top {
  display: none;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script type="text/javascript">
  jQuery(function($) {
    var offset = $( 'header' ).offset();

    $(window).scroll(function() {
      if ( $( window ).scrollTop() > offset.top ) {
        $( '#page-top' ).css( 'display', 'block' )
      } else {
        $( '#page-top' ).css( 'display', 'none' )
      }
    });
  });
</script>

$( window ).scrollTop() > offset.top

$( window ).scrollTop() > 100