user2291144
user2291144

Reputation: 65

Metro UI code not working

i have written a code for creating a sample page using metro ui. but the live tile function is not working. the tiles dont slide

<html xmlns="http://www.w3.org/1999/xhtml">

<html>
    <head>
        <link href="stt.css" type="text/css" rel="stylesheet"/>
    </head>
    <body>
        <div class="tiles">
            <div class="live-tile" data-mode="slide">
                <div style="background-color:Red;">test 1</div>
                <div style="background-color:Orange;">test back</div>
            </div>
            <div class="live-tile" data-mode="flip">
                <div style="background-color:green;">test 2</div>
                <div style="background-color:red;">test 2 - back</div>
            </div>

<script src="metrojs.js" type="text/javascript"> </script>  
<script src="metrojs.min.js" type="text/javascript"> </script>  
<script src="jquery-2.0.3.min.js" type="text/javascript"> </script> 
        <script type="text/javascript">
            $(document).ready(function () {
            alert("Document loaded");
                $(".live-tile").liveTile();
                alert("exiting alert");
            });
        </script>

    </body>
</html>

is the above code correct???

Upvotes: 0

Views: 2915

Answers (2)

user2489311
user2489311

Reputation:

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

Should be declared in your page <head></head> before the other js scripts. You should try using Firefox and firebug to error check, it would have helped you.

Upvotes: 1

Charaf JRA
Charaf JRA

Reputation: 8334

You need jQuery to be first , because metrojs uses jQuery,reorder js files like this :

<script src="jquery-2.0.3.min.js" type="text/javascript"> </script> 
<script src="metrojs.js" type="text/javascript"> </script>  
<script src="metrojs.min.js" type="text/javascript"> </script>  

Also , i don't think you need both metrojs.js and metrojs.min.js ,only one of them,and i suggest to put jQuery in the head of your page.

Upvotes: 1

Related Questions