Materialise CSS Sideav in Apache Cordova

Ich habe einige Probleme, das Material Design Sitenav mit Materialize CSS in Apache Cordova mit jQuery zu bauen. Die Chrom-Konsole sagt, dass:Materialise CSS Sideav in Apache Cordova

Uncaught TypeError: $(...).sideNav is not a function

index.html Körper:

<body> 
    <nav> 
     <ul class="right hide-on-med-and-down"> 
      <li><a href="#!">First Sidebar Link</a></li> 
      <li><a href="#!">Second Sidebar Link</a></li> 
     </ul> 
     <ul id="slide-out" class="side-nav"> 
      <li><a href="#!">First Sidebar Link</a></li> 
      <li><a href="#!">Second Sidebar Link</a></li> 
     </ul> 
     <a href="#" data-activates="slide-out" class="button-collapse"><i class="mdi-navigation-menu"></i></a> 
    </nav> 
    <script type="text/javascript" src="scripts/jquery.js"></script> 
    <script type="text/javascript" src="scripts/script.js"></script> 
    <script type="text/javascript" src="scripts/materialize.js"></script> 
     <script type="text/javascript" src="scripts/platformOverrides.js"></script> 
     <script type="text/javascript" src="scripts/index.js"></script>

script.js:

$(".button-collapse").sideNav();

Quelle

2016-03-28 MucaP

Besorgen Sie sich die init-Hack von Materialise [link] (http://materializecss.com/templates/starter-template/ js/init.js) Dann stelle sicher, dass es zuletzt in meinem JS aufgerufen wird. Wenn Sie es vor den Rest des JS setzen, wird es fehlschlagen. Sag mir, ob es funktioniert hat. – nanilab

Setzen Sie die script.js unter materialize.js – Raymond

@ Raymond gelöst! Setzen Sie die Antwort – MucaP

Code aus dieser Änderung:

<body> 
    <nav> 
     <ul class="right hide-on-med-and-down"> 
      <li><a href="#!">First Sidebar Link</a></li> 
      <li><a href="#!">Second Sidebar Link</a></li> 
     </ul> 
     <ul id="slide-out" class="side-nav"> 
      <li><a href="#!">First Sidebar Link</a></li> 
      <li><a href="#!">Second Sidebar Link</a></li> 
     </ul> 
     <a href="#" data-activates="slide-out" class="button-collapse"><i class="mdi-navigation-menu"></i></a> 
    </nav> 
    <script type="text/javascript" src="scripts/jquery.js"></script> 
    <script type="text/javascript" src="scripts/script.js"></script> 
    <script type="text/javascript" src="scripts/materialize.js"></script> 
     <script type="text/javascript" src="scripts/platformOverrides.js"></script> 
     <script type="text/javascript" src="scripts/index.js"></script>

Um dies:

<body> 
    <nav> 
     <ul class="right hide-on-med-and-down"> 
      <li><a href="#!">First Sidebar Link</a></li> 
      <li><a href="#!">Second Sidebar Link</a></li> 
     </ul> 
     <ul id="slide-out" class="side-nav"> 
      <li><a href="#!">First Sidebar Link</a></li> 
      <li><a href="#!">Second Sidebar Link</a></li> 
     </ul> 
     <a href="#" data-activates="slide-out" class="button-collapse"><i class="mdi-navigation-menu"></i></a> 
    </nav> 
    <script type="text/javascript" src="scripts/jquery.js"></script> 
    <script type="text/javascript" src="scripts/materialize.js"></script> 
    <script type="text/javascript" src="scripts/script.js"></script> 
     <script type="text/javascript" src="scripts/platformOverrides.js"></script> 
     <script type="text/javascript" src="scripts/index.js"></script>

Quelle

2016-03-29 20:45:21 Raymond

jsbin demo Es sieht dies funktioniert.

Quelle

2016-03-29 12:02:41 Mentori

Nein. Ich denke nur, du solltest jsFiddle benutzen, da es besser ist zu lesen und zu schreiben, ja, es ist los, ich weiß es aber ... – MucaP

Materialise CSS Sideav in Apache Cordova

Antwort

Verwandte Themen