问MetroJS入门
EN

Stack Overflow用户

提问于 2014-08-15 15:08:09

回答 1查看 550关注 0票数 0

我很少尝试jquery，但偶然发现了Metro JS http://www.drewgreenwell.com/projects/metrojs，这给我留下了深刻的印象，所以我想我应该试一试。我喜欢让事情变得简单。作为一个jquery专家，我似乎不能让翻转磁贴工作，所以如果有任何帮助，我将不胜感激。我的完整代码如下。

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <title>Untitled Document</title>
    <link rel="stylesheet" href="metrojs.css" type="text/css">
    <script src="jquery-1.7.1.min.js" type="text/javascript"></script>
    <script language="javascript" type="text/javascript" src="metrojs.js"></script>
    <script language="javascript" type="text/javascript">
    //animate on click

    var $tile1 = $("#tile1").liveTile();
    $("#tile1").on("click", function(){
        $("#tile1").liveTile('play', 0);
    });

    var $tile2 = $("#tile2").liveTile();
    $("#tile2").on("click", function(){
        $("#tile2").liveTile("play", 0);
    });

    </script>

        <script type="text/javascript">
            $(document).ready(function() {
                $(".live-tile,#tile1,#tile2").liveTile();
            });
        </script>


    </head>

    <body>
    <h1>Animate on Click</h1>
    <div class="tiles red">
        <div class="live-tile" id="tile1" data-mode="flip">        
            <div>
                <a class="full" href="#">front</a>
                <span class="tile-title">front title</span>
            </div>
            <div>
                <p>this tile flips once vertically when clicked using a repeat count of 0</p>
                <span class="tile-title">back title</span>
            </div>
        </div>
        <div class="live-tile blue" id="tile2" data-direction="horizontal" data-mode="flip">     
            <div>front
                  <span class="tile-title">front title</span>
            </div>
            <div>
                <p>this tile flips horizontally on an interval or when when clicked
                   <span class="tile-title">back title</span>
                </p>
            </div>
        </div>
    </div>
    </body>

    </html>

jquery

html

回答 1

Stack Overflow用户

发布于 2014-08-15 15:27:33

看起来为了让metro.js正常工作，你需要包含jQuery。

您可以下载最新版本的jQuery here。将其保存在与其余代码相同的文件夹中，并添加以下行：

<script src="jquery.2.1.1.min.js" type="text/javascript"></script>

确保在包含metrojs.js之前放入此行--您需要在加载metro.js之前加载jQuery。

将来，你可以通过打开web控制台来调试它，它将报告网页上发生的任何Javascript错误，以及大量其他有用的信息。在这种情况下，运行您的网页导致控制台报告jQuery和$未定义，这有助于我确定问题所在。

关于访问web/debug控制台的说明以及其他适用于Firefox、Chrome和IE的有用的开发工具都可以在线获得。

票数 1

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/25322513

复制

相似问题

问MetroJS入门
EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问MetroJS入门EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问MetroJS入门
EN