jQuery. Липкий заголовок на свитке. Остановить эффекты при каждом прокрутке

Question

В настоящее время я использую этот фрагмент, чтобы заголовок моей страницы «липкий», когда пользователь прокручивается мимо определенного расстояния;

$(window).scroll(function() { 

var headerheight = $("header").height(); 
var header = $(document).scrollTop(); 

if (header > height-75) { 
    $('header').addClass('sticky'); 
    $('body').css("padding-top", headerheight); 
    $('.sticky').css('top', 0); 
} else { 
    $('header').removeClass('sticky'); 
    $('body').css("padding-top", 0); 
    $('header').css('top', 25); 
} 

Единственная проблема заключается в том, что .sticky класса применяется на КАЖДОЙ свитке мимо указанного расстояния и вызывает у меня проблемы, когда я хочу, чтобы применить ослабление эффектов к нему. Поэтому в основном я хочу, чтобы класс .sticky применялся один раз, когда страница прокручивается мимо определенной точки. Как я могу добиться этого с помощью текущего кода? Или мне нужно начинать с нуля?

Answer 1

Просто проверьте, если класс присутствует или нет:

if (header > height-75) { 
    if (!$('header').hasClass('sticky')){ 
     $('header').addClass('sticky'); 
     $('body').css("padding-top", headerheight); 
     $('.sticky').css('top', 0); 
    } 
} else { 
    if ($('header').hasClass('sticky')){ 
     $('header').removeClass('sticky'); 
     $('body').css("padding-top", 0); 
     $('header').css('top', 25); 
    } 
}