addClass мигает при прокрутке окна

Question

Я добавляю некоторый класс к ссылке, когда ее цель видна в окне. Но когда я нажимаю эту ссылку, класс добавляется, затем удаляется, а затем добавляется снова, что создает нежелательный «мигающий» эффект. Эта скрипка http://jsfiddle.net/inliner/gx7ocfhr/6/ объясняет все это лучше. Прокрутите немного, затем щелкните один из трех элементов в заголовке. Что я здесь делаю неправильно? Как предотвратить это мигание?

function isScrolledIntoView(elem) 
{ 
    var docViewTop = $(window).scrollTop(); 
    var docViewBottom = docViewTop + $(window).height(); 
    var elemTop = $(elem).offset().top; 
    var elemBottom = elemTop + $(elem).height(); 
    return ((elemTop - docViewTop)<= 240) && ((elemBottom - 70) >= docViewTop); 
}  
$(window).scroll(function(){ 
    isScrolledIntoView("#advertizers") ? $(".s1").addClass("active") : $(".s1").removeClass("active"); 
    isScrolledIntoView("#traders") ? $(".s2").addClass("active") : $(".s2").removeClass("active"); 
    isScrolledIntoView("#agencies") ? $(".s3").addClass("active") : $(".s3").removeClass("active"); 
}); 

Answer 1

Проблема в том, что обработчик $(window).scroll уволен во время функции animate(). попробуйте перевязать его в animate() callback. проверить это

http://jsfiddle.net/f8jjcspt/1/

Edit: также LukeThompson предложение является более эффективным

Answer 2

Я считаю, что это связано с событием прокрутки стрельбы на якорь щелчок, возможное решение было бы добавить флаг, как isAnchorScroll, определить и установить это ложь внутри вашего $ (документ) .ready (function() { В событии $ (window) .scroll проверьте свой флаг и, если true верните его перед изменением класса, установите флаг в true в вашей функции anchorScroll, а затем установите false в обратном вызове анимации. Также вы хотите позвонить $ (window) .trigger ('scroll') в обратном вызове анимации. Надеюсь, это поможет