Javascript 在我的代码中，materializecss类“；“卡片展示”；它不起作用了_Javascript_Html_Materialize

Javascript 在我的代码中，materializecss类“；“卡片展示”；它不起作用了

javascript html

Javascript 在我的代码中，materializecss类“；“卡片展示”；它不起作用了,javascript,html,materialize,Javascript,Html,Materialize,下面是我使用html代码的materializecss框架。这是我第一次尝试实现卡我不知道为什么卡片展示课不起作用。请帮我打开活动卡。多谢各位物化卡片 Lorem Ipsum只是印刷和排版行业的虚拟文本。自16世纪以来，Lorem Ipsum一直是行业标准的虚拟文本，当时一位不知名的印刷商拿起一个打印工具，将其拼凑成一本打印样本书。它有不仅存活了五个世纪，而且飞跃到电子排版，基本上保持不变。 Lorem Ipsum只是印刷和排版行业的虚拟文本。自16世纪以来，Lorem

下面是我使用html代码的materializecss框架。这是我第一次尝试实现卡

我不知道为什么卡片展示课不起作用。请帮我打开活动卡。多谢各位


物化卡片








Lorem Ipsum只是印刷和排版行业的虚拟文本。自16世纪以来，Lorem Ipsum一直是行业标准的虚拟文本，当时一位不知名的印刷商拿起一个打印工具，将其拼凑成一本打印样本书。它有
不仅存活了五个世纪，而且飞跃到电子排版，基本上保持不变。
Lorem Ipsum只是印刷和排版行业的虚拟文本。自16世纪以来，Lorem Ipsum一直是行业标准的虚拟文本，当时一位不知名的印刷商拿起一个打印工具，将其拼凑成一本打印样本书。它有
不仅存活了五个世纪，而且飞跃到电子排版，基本上保持不变。
卡片标题摩尔垂直


卡片标题栏
以下是有关该产品的更多信息，仅在单击后才会显示
版权及副本；2016 Jarin |保留所有权利。

您的错误是：（脚本标记中的css）

替换为：

好了：


物化卡片








Lorem Ipsum只是印刷和排版行业的虚拟文本。自16世纪以来，Lorem Ipsum一直是行业标准的虚拟文本，当时一位不知名的印刷商拿起一个打印工具，将其拼凑成一本打印样本书。它有
不仅存活了五个世纪，而且飞跃到电子排版，基本上保持不变。
Lorem Ipsum只是印刷和排版行业的虚拟文本。自16世纪以来，Lorem Ipsum一直是行业标准的虚拟文本，当时一位不知名的印刷商拿起一个打印工具，将其拼凑成一本打印样本书。它有
不仅存活了五个世纪，而且飞跃到电子排版，基本上保持不变。
卡片标题摩尔垂直


卡片标题栏
以下是有关该产品的更多信息，仅在单击后才会显示
版权及副本；2016 Jarin |保留所有权利。

通常，最好在正文末尾导入

js

文件，以减少页面加载时间

另外，在导入

materialize.js

这里是


物化卡片








Lorem Ipsum只是印刷和排版行业的虚拟文本。自16世纪以来，Lorem Ipsum一直是行业标准的虚拟文本，当时一位不知名的印刷商拿起一个打印工具，将其拼凑成一本打印样本书。它有
不仅存活了五个世纪，而且飞跃到电子排版，基本上保持不变。
Lorem Ipsum只是印刷和排版行业的虚拟文本。自16世纪以来，Lorem Ipsum一直是行业标准的虚拟文本，当时一位不知名的印刷商拿起一个打印工具，将其拼凑成一本打印样本书。它有
不仅存活了五个世纪，而且飞跃到电子排版，基本上保持不变。
卡片标题摩尔垂直


卡片标题栏
以下是有关该产品的更多信息，仅在单击后才会显示
版权及副本；2016 Jarin |保留所有权利。

@TimOgilvy代码片段已发布。对于那个愚蠢的错误，我深表歉意。但还没有开始工作。请检查它播放的代码。谢谢，是的。它起作用了。非常感谢。关于html的脚本标记，是否需要@安尼Menon@JobaidaJarin不，不需要，由SO代码段添加。（对于jQuery）。

<!doctype HTML>
<html>

<head>
  <title>materialize cards</title>
  <link href="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.97.6/css/materialize.min.css" rel="stylesheet">
  <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">

</head>

<body>
  <nav class="blue darken-2">
    <div class="navbar-wrapper container">
      <a href="#" class="brand-logo">MyMaterializecss</a>

      <ul class="right">
        <li><a href="#">HOME</a>
        </li>
        <li><a href="#">PRODUCTS</a>
        </li>
        <li><a href="#">CONTACT</a>
        </li>
      </ul>
    </div>
  </nav>

  <div class="container">
    <div class="row">
      <div class="col l4">
        <div class="card-panel pink white-text">
          Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has
          survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged.
        </div>
      </div>

      <div class="col l4">
        <div class="card-panel">
          Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has
          survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged.
        </div>
      </div>

      <div class="col l4">
        <div class="card">
          <div class="card-image waves-effect waves-block waves-light">
            <img class="activator" src="shuvonet-revised-front-end-03.png">
          </div>
          <div class="card-content">
            <span class="card-title activator grey-text text-darken-4">Card Title<i class="material-icons right">more_vert</i></span>
            <p><a href="#">This is a link</a>
            </p>
          </div>
          <div class="card-reveal">
            <span class="card-title grey-text text-darken-4">Card Title<i class="material-icons right">close</i></span>
            <p>Here is some more information about this product that is only revealed once clicked on.</p>
          </div>
        </div>
      </div>
    </div>
  </div>

  <footer class="page-footer blue darken-2">
    <div class="container">
      <div class="footer-copyright">
        Copyright &copy; 2016 Jarin | All rights reserved.
      </div>
    </div>
  </footer>

  <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.0.0-beta1/jquery.min.js"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.97.6/js/materialize.min.js"></script>
</body>

</html>