ページトップボタンを上スクロールのときだけ表示させたい

Question

$(function(){
  var pagetop = $('#pagetop');
  pagetop.hide();
  $(window).scroll(function () {
     if ($(this).scrollTop() > 100) {
          pagetop.fadeIn();
     } else {
          pagetop.fadeOut();
     }
  });
  pagetop.click(function () {
     $('body, html').animate({ scrollTop: 0 }, 500);
     return false;
  });
});

現在上記でページトップを表示させています。
【現在の仕様】
下スクロール(100)したらページトップボタンが表示され、topまで戻ったらボタンは消える

【やりたいこと】
上スクロールのだけ、ページトップボタンが表示され、topまで戻ったらボタンは消したい

下記のコードを組み合わせて実装できないでしょうか
どのように記述すればよいでしょうか？
ご教授ください。

$(function(){
  var pos = 0;
  var header = $('#pagetop'');
  
  $(window).on('scroll', function(){
    if($(this).scrollTop() < pos ){
      //上にスクロールしたとき
      header.removeClass('hide');
    }else{
      //下にスクロールしたとき
      header.addClass('hide');
    }
    pos = $(this).scrollTop();
  });
});

Answer 1

下記でどうでしょう。

$(function(){
  let pos = 0;
  let pagetop = $('#pagetop');
  pagetop.hide();
  $(window).scroll(function () {
     if($(this).scrollTop() < pos && $(this).scrollTop() != 0 ){
      //上にスクロールしたとき かつ スクロール位置が0でない
      pagetop.fadeIn();
    }else{
      //下にスクロールしたとき
      pagetop.fadeOut();
    }
    pos = $(this).scrollTop();
  });
  pagetop.click(function () {
     $('body, html').animate({ scrollTop: 0 }, 500);
     return false;
  });
});

Comments

[buk]

完璧です。
ありがとうございました！