Обнаружить прокрутку вниз

Question

Мне нужно найти способ изменить css, когда элемент больше не находится по умолчанию, а когда пользователь прокручивает его назад, по умолчанию css устанавливается обратно.

Пример: У меня есть фиксированный заголовок с высотой 30 пикселей, а его положение сверху: 0, когда пользователь scoll down, высота будет 15 пикселей, а если пользователь прокрутит вверх, а заголовок получит свой начальное положение сверху: 0, высота снова будет 30 пикселей.

Я пытался что-то вроде этого:

var location = $('#header').offset(); 
     $("#header").scroll(function() { 
      if(location.top!=0){ 
       $('#header').css({'height': '4vw'}); 
      }else{ 
       $('#header').css({'height': '6vw'}); 
      } 
     }); 

Answer 1

Вы можете использовать окно на свитка, чтобы проверить прокрутки possition; Вы можете получить положение прокрутки с помощью $(window).scrollTop()

$(window).on('scroll', function() { 
    var scrollTop = $(window).scrollTop(); 
    if (scrollTop > 50) { 
     $('#header').stop().animate({height: "30px"},200); 
    } 
    else { 
     $('#header').stop().animate({height: "15px"},200); 
    } 
}); 

Иметь хороший день ...