Dojo IconContainer не работи

Опитвам се да изпълня този прост HTML код, който съдържа Dojo Icon Container, но някак си не работи. Може ли някой да ми помогне да разбера какво правя погрешно? Използвам dojo версия 1.7.

    <!DOCTYPE HTML>
    <html>
    <head>
            <meta name="viewport" content="width=device-width,initial-scale=1,maximum-       scale=1,minimum-scale=1,user-scalable=no"/>
            <meta name="apple-mobile-web-app-capable" content="yes" />
            <title>Icon</title>


          <style>
                    .box {
                            border: 1px solid #A7C0E0;
                            width: 300px;
                            height: 250px;

                            background-color: white;
                    }
            </style> 
            <script type="text/javascript" src="dojo/dojo.js" djConfig="parseOnLoad:     true"></script>
              <script type="text/javascript" src="dojox/mobile/mobile-all.js" ></script>
            <script language="JavaScript" type="text/javascript">
                    //dojo.require("dojo.parser"); // Use the lightweight parser.
                    dojo.require("dojox.mobile.parser");
                    dojo.require("dojox.mobile");
                    dojo.require("dojox.mobile.IconContainer");
                    dojo.require("dojox.mobile.IconItem");
                    dojo.require("dojox.mobile.RoundRectCategory");
                    dojo.require("dojox.mobile.RoundRectList");
                    dojo.require("dojox.mobile.ListItem");
                    dojo.requireIf(!dojo.isWebKit, "dojox.mobile.compat");
            </script>
    </head>
    <body>
           <div id="foo" dojoType="dojox.mobile.View" selected="true">
                    <h1 dojoType="dojox.mobile.Heading">Icon Container</h1>
                    <ul dojoType="dojox.mobile.IconContainer">
                            <li dojoType="dojox.mobile.IconItem" label="app1" icon="images/icon.png" lazy="true"><div class="box"></div></li>
                            <li dojoType="dojox.mobile.IconItem" label="app2" icon="images/icon.png" lazy="true"><div class="box"></div></li>
                            <li dojoType="dojox.mobile.IconItem" label="app3" icon="images/icon.png" lazy="true"><div class="box"></div></li>
                            <li dojoType="dojox.mobile.IconItem" label="moveTo" icon="images/icon.png" moveTo="about" transition="slide"></li>

                    </ul>
            </div> 

            <div id="about" dojoType="dojox.mobile.View">
                    <h1 dojoType="dojox.mobile.Heading" back="Icon Container" moveTo="foo">About</h1>
                    <h2 dojoType="dojox.mobile.RoundRectCategory">My Phone</h2>
                    <ul dojoType="dojox.mobile.RoundRectList">
                            <li dojoType="dojox.mobile.ListItem" rightText="AcmePhone">
                                    Network                                                                                    
                            </li>                                                                                              
                            <li dojoType="dojox.mobile.ListItem" rightText="AcmePhone">
                                    Line
                            </li>
                            <li dojoType="dojox.mobile.ListItem" rightText="1024">
                                    Songs
                            </li>
                    </ul>
            </div>
    </body>


person Anil kumar    schedule 08.09.2013    source източник


Отговори (1)


можете да го накарате да работи чрез:

  1. изискващ dojox.mobile.deviceTheme, за да зареди css приспособленията
  2. премахване на директивата на скрипта dojox/mobile/mobile-all.js

Това ви дава следния изходен код:

<!DOCTYPE HTML>
<html>
<head>
        <meta name="viewport" content="width=device-width,initial-scale=1,maximum-       scale=1,minimum-scale=1,user-scalable=no"/>
        <meta name="apple-mobile-web-app-capable" content="yes" />
        <title>Icon</title>


      <style>
                .box {
                        border: 1px solid #A7C0E0;
                        width: 300px;
                        height: 250px;

                        background-color: white;
                }
        </style> 
        <script type="text/javascript" src="dojo/dojo.js" djConfig="parseOnLoad:     true"></script>
        <script language="JavaScript" type="text/javascript">
                //dojo.require("dojo.parser"); // Use the lightweight parser.
                dojo.require("dojox.mobile.deviceTheme");
                dojo.require("dojox.mobile.parser");
                dojo.require("dojox.mobile");
                dojo.require("dojox.mobile.IconContainer");
                dojo.require("dojox.mobile.IconItem");
                dojo.require("dojox.mobile.RoundRectCategory");
                dojo.require("dojox.mobile.RoundRectList");
                dojo.require("dojox.mobile.ListItem");
                dojo.requireIf(!dojo.isWebKit, "dojox.mobile.compat");
        </script>
</head>
<body>
       <div id="foo" dojoType="dojox.mobile.View" selected="true">
                <h1 dojoType="dojox.mobile.Heading">Icon Container</h1>
                <ul dojoType="dojox.mobile.IconContainer">
                        <li dojoType="dojox.mobile.IconItem" label="app1" icon="images/icon.png" lazy="true"><div class="box"></div></li>
                        <li dojoType="dojox.mobile.IconItem" label="app2" icon="images/icon.png" lazy="true"><div class="box"></div></li>
                        <li dojoType="dojox.mobile.IconItem" label="app3" icon="images/icon.png" lazy="true"><div class="box"></div></li>
                        <li dojoType="dojox.mobile.IconItem" label="moveTo" icon="images/icon.png" moveTo="about" transition="slide"></li>

                </ul>
        </div> 

        <div id="about" dojoType="dojox.mobile.View">
                <h1 dojoType="dojox.mobile.Heading" back="Icon Container" moveTo="foo">About</h1>
                <h2 dojoType="dojox.mobile.RoundRectCategory">My Phone</h2>
                <ul dojoType="dojox.mobile.RoundRectList">
                        <li dojoType="dojox.mobile.ListItem" rightText="AcmePhone">
                                Network                                                                                    
                        </li>                                                                                              
                        <li dojoType="dojox.mobile.ListItem" rightText="AcmePhone">
                                Line
                        </li>
                        <li dojoType="dojox.mobile.ListItem" rightText="1024">
                                Songs
                        </li>
                </ul>
        </div>
</body>
person Sebastien Brunot    schedule 09.09.2013
comment
Да, Себастиен, успях да го разбера и направих същото с добавяне на няколко реда, което реши проблема.... - person Anil kumar; 11.09.2013