將導航欄設置爲僅在主頁上淡入？

在導軌上使用Bootstrap 3。我的目標是讓導航欄在滾動時正常顯示（工作正常），但當頁面太短而無法滾動時，也會顯示而不滾動。或者只顯示在主頁上。後者是首選，但或者將解決我的問題。將導航欄設置爲僅在主頁上淡入？

我的（工作）JS。

(function ($) { 
     $(document).ready(function(){ 

     // hide .navbar first 
     $(".navbar").hide(); 

     // fade in .navbar 
     $(function() { 
      $(window).scroll(function() { 

        // set distance user needs to scroll before we start fadeIn 
       if ($(this).scrollTop() > 100) { 
        $('.navbar').fadeIn(); 
       } else { 
        $('.navbar').fadeOut(); 
       } 
      }); 
     }); 

    }); 
     }(jQuery))

來源

2014-09-05 John Thomas Connor

看起來很傻但是..只要檢查路徑名？

if(window.location.pathname.match(/myhomepageurlregex/)){ 
    $('.navbar').fadeIn(); 
}

myhomepageurlregex是無論您的主頁網址恰好是，可以匹配它的一部分，如果需要的話。

來源

2014-09-05 20:24:37

你也可以添加一個類'家'或任何一個標籤，並調用相同的功能。

<body class="home"></body> 
<script> 
    if ($('body').hasClass('home')) { 
     $('.navbar').fadeIn(); 
     } else { 
     $('.navbar').fadeOut(); 
    } 
</script>

來源

2014-09-05 21:00:27

如果你只想在一個頁面上顯式地顯示導航欄，爲什麼不把一個標籤放到該頁面的ERB中呢？

<script type="text/javascript"> 
    $('.navbar').fadeIn(); 
</script>

來源

2014-09-05 21:02:37 pcrglennon

將導航欄設置爲僅在主頁上淡入？

回答

相關問題