JavaScriptを使用してスクロールしながら画像を置き換えた後にフェードが繰り返されます

Question

スクロールするときにページの見出しのロゴ画像をフェード効果で置き換えようとしています。それは正しい方法で作業を開始し、イメージの置換は行われますが、サイトをスクロールし続けている間は、新しいロゴがフェードし続けます。ここで

は私のコードです：

​​

あなたは、私はそれを修正する可能性がどのようにwww.ultramarinosvillena.com でそれを見ることができますか？

Answer 1

編集：申し訳ありませんが、私の間違い - 最初に投稿して考える。 ;）各スクロールイベントで条件文の1つがトリガされました。スクロールポイントに達すると、1回だけトリガされます。

あなたはNAV-スクロールクラスチェックする必要があります：あなたは、ロゴは、現在（https://api.jquery.com/visible-selector/）[表示]であるかどうかを確認するためにチェックを入れることができ

$(document).ready(function(){ 

    var $navbar = $(".navbar-fixed-top"), 
     $logo = $("#logo"), 
     currentScroll; 

    $(window).on('scroll', function(){ 

     currentScroll = $(window).scrollTop(); 

     if (currentScroll > 100 && !($navbar.hasClass('nav-scrolled'))) { 

      $navbar.addClass("nav-scrolled"); 
      $logo.fadeOut('',function(){ 
       $(this).attr('src','Template/images/logo-scrolled.png').fadeIn(); 
      }); 

     } else if (currentScroll < 100 && $navbar.hasClass('nav-scrolled')) { 

      $navbar.removeClass("nav-scrolled"); 
      $logo.fadeOut('',function(){ 
       $(this).attr('src','Template/images/logo.png').fadeIn(); 
      }); 
     } 

    }); 
});