Показать div после прокрутки 100px в верхней части страницы

Я нашел это, но это составляет 100 пикселей перед нижней частью страницы. Мне нужно 100px в верхней части страницы. Я знаю, как реализовать его, я сделал другие jquery-анимации, просто не то, что должно быть в этом.

$(window).scroll(function(){
  if($(window).scrollTop() + 100 > $(document).height() - $(window).height() ){

    alert("at bottom");

  }
});

И также, мне нужно знать, как отменить это, чтобы div исчез, когда пользователь прокручивает резервную копию до 100px.

Это будет использоваться для панели навигации.

Edit2 > Это также сработало:

$(window).scroll(function(){
  if($(window).scrollTop() > 100){
      $("#div").fadeIn("slow");
  }
});
$(window).scroll(function(){
  if($(window).scrollTop() < 100){
      $("#div").fadeOut("fast");
  }
});

Ответ 1

Попробуйте следующее:

$(window).scroll(function() {
    if ($(window).scrollTop() > 100) {
        // > 100px from top - show div
    }
    else {
        // <= 100px from top - hide div
    }
});

Ответ 2

Попробуйте следующее:

var menu = $("nav");
$(window).scroll(function(){
  //more then or equals to
  if($(window).scrollTop() >= 100 ){
       menu.show();

  //less then 100px from top
  } else {
     menu.hide();

  }
});

Ответ 3

Я бы рекомендовал сделать это:

$("#divname").hide();
$(window).scroll(function() {
    if ($(window).scrollTop() > 100) {
        $("#divname").fadeIn("slow");
    }
    else {
        $("#divname").fadeOut("fast");
    }
});

Теперь div уже скрыт, когда вы посещаете свою страницу. Без этого:

$("#divname").hide()

Он покажет, а затем выполнит FadeOut. И это не то, что вы хотите.