Как остановить анимацию в jQuery

Question

Я хочу остановить анимацию, показывающую «черный заголовок».

Если прокрутить пару раз быстро вы заметите, что анимация запускается и черный заголовок будет «вспышка»

$(window).scroll(function() { 
    if ($(window).scrollTop() > 200) { 
     $(".prim").fadeIn(250); 
    } 
    else { 
     $(".prim").fadeOut(250); 
    } 
}); 

//Sticky bar responsive fix 
$(window).resize(function(){ 
    var width = $(window).width(); 

    if(width > 1024 && $(window).scrollTop() > 190){ 
     $(".prim").fadeIn(250); 
    } 
    else{ 
     $(".prim").css('display', 'none'); 
    } 

}); 

http://jsfiddle.net/zlajaa1/fbe4p283/1/

Answer 1

Вы можете использовать метод stop(). Метод принимает 2 параметра.

Из документов Jquery:

clearQueue Тип: Boolean Логическое значение, указывающее, следует ли удалить анимацию в очереди, а также. По умолчанию false.

jumpToEnd Тип: Boolean Логическое значение, указывающее, следует ли немедленно завершить текущую анимацию. По умолчанию false.

jsfiddle demo

$(window).scroll(function() { 
    if ($(window).scrollTop() > 200) { 
     $(".prim").fadeIn(250); 
    } 
    else { 
     $(".prim").stop(true, true).fadeOut(250); 
    } 
}); 

//Sticky bar responsive fix 
$(window).resize(function(){ 
    var width = $(window).width(); 

    if(width > 1024 && $(window).scrollTop() > 190){ 
     $(".prim").fadeIn(250); 
    } 
    else{ 
     $(".prim").css('display', 'none'); 
    } 

});