用Javascript滾動的Navbar淡入淡出動畫

Question

mainMenu是一個大的導航條，它在下滾動中變得不可見，並被topMenu（一個小導航頂部固定的條）所取代。

我有一個問題：只有topmenu出現時，替換纔會淡入淡出。 我怎麼能讓topmenu消失 - 動畫也消失時？

這裏是我的javascript：

<script> 
     var mainMenuTop = $('#mainMenu').offset().top; 
     var mainMenuBottom = mainMenuTop + 200; 
     $(window).scroll(function() { 
      var scrollTop = $(window).scrollTop(); 

      if (scrollTop > mainMenuBottom) { 

       if (($("#topMenu").is(":visible") === false)) { 

        $('#topMenu').fadeIn('slow'); 
       } 
      } else { 

       if ($("#topMenu").is(":visible")) { 
        $('#topMenu').hide(); 
       } 
      } 
     }); 
    </script> 

Answer 1

我認爲你在尋找什麼是相當簡單的。取而代之的這條線：

$('#topMenu').hide(); 

它改成這樣：

$('#topMenu').fadeOut('slow'); 

一個不錯的簡單的jQuery動畫。有關更多詳細信息，請參見http://api.jquery.com/fadeout/。

希望有所幫助。