jquery移动数据主题无法正常工作

时间:2014-02-04 08:06:41

标签: jquery jquery-mobile

我有一个简单的登录页面,我正在尝试将主题“b”应用于它,但它不起作用。页面看起来很暗,而不是主题b的样子。 有什么想法吗?

感谢。

             
        
        我的标题

    <link rel="shortcut icon" href="img/favicon.ico">
    <link rel="stylesheet" href="css/themes/default/jquery.mobile-1.4.0.min.css">        
    <!--<link href="css/ios_inspired/styles.css" rel="stylesheet" />-->
    <!--<link rel="stylesheet" href="css/jqm-demos.css">-->
    <script src="js/jquery.mobile-1.4.0/jquery.js"></script>        
    <script src="js/jquery.mobile-1.4.0/jquery.mobile-1.4.0.min.js"></script>

</head>
<body>


    <div data-role="page" id="Page_Login"  data-quicklinks="true" data-theme="b" >

        <div data-role="header" >
            <h1>My header</h1>                
        </div>

        <div role="main" class="ui-content jqm-content jqm-fullwidth" data-theme="b" >

            <h1 style=" text-align:center;">Connect</h1>                  

            <form dir="rtl">

                <!--<div data-role="fieldcontain" >-->
                 <label for="txtEmail">email:</label>
                 <input type="email" name="txtEmail" id="txtEmail" value="" />
                <!--</div> -->      

                <!--<div data-role="fieldcontain" >-->
                 <label for="txtPassword">password:</label>
                 <input type="password" name="txtPassword" id="txtPassword" value="" />
                <!--</div> --> 

                <a  href="" data-transition="flip" class="ui-btn ui-corner-all" onclick="MemberLogIn()">connect</a>                         
            </form>

        </div><!-- /content -->

    </div><!-- /page -->            

</body>

1 个答案:

答案 0 :(得分:26)

  

更新

     

应该升级经典主题以使用jQuery Mobile 1.4.x

正常工作      

Upgrade guide


与旧版本的jQuery Mobile不同,最新版本1.4只有两个主题/样本 a b 。后者是黑/黑主题。

  1. 您可以使用ThemeRoller创建自己的主题。

  2. 使用jQuery Mobile提供的经典样式表以及默认样式表。

    <link rel="stylesheet" href="http://code.jquery.com/mobile/1.4.0/jquery.mobile-1.4.0.min.css" />
    <link rel="stylesheet" href="http://demos.jquerymobile.com/1.4.0/theme-classic/theme-classic.css" />
    
  3.   

    <强> Demo