Question

我正在尝试使用MaterialiseCSS创建一个移动导航栏，但我不明白在哪里发布Javascript。

说要放这段代码：

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

在我的

中

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

我根本没有使用Javascript的经验，所以即使使用google-fu，弄清楚这意味着什么也很困难。

这是否在现有的materialize.js文件中？如果是这样，在哪里？

here is the code for my navbar

Answer 1

在html的body标签中添加此代码后：

<nav>
    <div class="nav-wrapper">
      <a href="#" data-activates="mobile-demo" class="button-collapse"><i class="material-icons">menu</i></a>
      <a href="#" class="brand-logo">Logo</a>
      <ul id="nav-mobile" class="right hide-on-med-and-down">
        <li><a href="sass.html">Sass</a></li>
        <li><a href="badges.html">Components</a></li>
        <li><a href="collapsible.html">JavaScript</a></li>
      </ul>
    </div>
  </nav>

链接materialize.css样式表和相应的materialize.js文件。现在，由于你有一个侧导航，你需要做的就是创建一个新的js文件，在你的html中链接它并添加这个代码：

$(document).ready(function(){
  $('.button-collapse').sideNav();
});

确保在jQuery和materialize.js之后链接脚本。

Answer 2

可能最好创建另一个In [91]: X2 Out[91]: array([[1, 2], [3, 4]]) In [92]: Y2 Out[92]: array([[11, 12], [13, 14]]) In [93]: Z2 Out[93]: array([[21, 22], [23, 24]]) In [94]: np.column_stack((X2.ravel(), Y2.ravel(), Z2.ravel())) Out[94]: array([[ 1, 11, 21], [ 2, 12, 22], [ 3, 13, 23], [ 4, 14, 24]])文件并将其放在那里。然后在body标签的末尾引用它作为这样的脚本链接..

scripts.js

如果这是您拥有的唯一JS代码，您也可以将其内嵌在HTML中，如...

<script src="scripts.js"></script>

无论哪种方式，它都必须遵循<script> $( document ).ready(function(){ $(".button-collapse").sideNav(); }) </script>文件。

实现SideNav：http://codeply.com/go/iwJMN5S52h

在物化css中为移动Navbar放置代码的位置？

2 个答案: