MaterializeCSSサイド・ナビゲーターが動作しない

Question

私はthisポストと同じ問題を抱えていますが、与えられた答えが私のために働いていません。 MaterializeCSSモバイルハンバーガーメニューを使用しようとすると、それは最初に押されただけで動作し、その後はURLの最後にハスタグを追加して、実際にサイドのナビゲーションバーを開くことはありません。

マイHTML：

<nav class="white"> 
    <div class="nav-wrapper"> 
     <a id="logo-container" href="/" class="brand-logo center">JCSDevelopment</a> 
     <a href="#" data-activates="mobile-demo" class="button-collapse"><i class="material-icons">menu</i></a> 
     <ul id="nav-mobile" class="right hide-on-med-and-down"> 
      <li><a href="/">Home</a></li> 
      <li><a href="/portfolio">Portfolio</a></li> 
      <li><a href="/contact">Contact</a></li> 
     </ul> 
     <ul id="mobile-demo" class="side-nav"> 
      <li><a href="/">Home</a></li> 
      <li><a href="/portfolio">Portfolio</a></li> 
      <li><a href="/contact">Contact</a></li> 
     </ul> 
    </div> 
</nav> 

そして、私のJS：私は、私も.ready()関数に私のJSの残りの部分を入れて試してみましたが、私のコードにソリューションを入れて置いた

$(window).scroll(function(){ 

    $('.hideme').each(function(i){ 
     var bottom_of_object = $(this).offset().top + $(this).outerHeight(); 
     var bottom_of_window = $(window).scrollTop() + $(window).height(); 

     if(bottom_of_window > bottom_of_object){ 
      $(this).animate({'opacity':'1'},500); 
      console.log('reveal image'); 
     }; 
    }); 
}); 

(function($){ 
    $(function(){ 
     $('.parallax').parallax(); 
     $('.button-collapse').sideNav(); 
    }); 
})(jQuery); 

.sideNav()機能は最後に動作しませんでした。

Answer 1

あなたの$(window).scrollハンドラが視差プラグインを妨害していると思われますが、完全なマークアップなしでは伝えられません。代わりにmaterializecss scrollfire pluginを使用してみましたか？

This codepenは、視差と一緒にうまく働くハンバーガーを示しています。

This codepenは前のものと同じですが、画像不透明度を変更するためにscrollfireプラグインを使用する方法も示しています。