0

JQuery Mobile を使用して非常に単純なページを作成しようとしています (実際に遊んだのは初めてです)。ナビゲーションバーが正しく表示されないようです。JQuery Mobile ページのコードは非常に単純に見えますが、私が知る限り、そのままコピーしています。このように表示されますが…

ここに画像の説明を入力

これが私のコードです（参考までに、theme.cssファイルはデフォルトのJQuery cssファイルです）：

<html>
   <head>
      <title></title>
      <meta charset="utf-8">
      <meta name="viewport" content="width=device-width, initial-scale=1">
      <link rel="stylesheet" href="../css/theme.css" />
      <script src="../js/jquery-1.9.1.min.js"></script>
      <script src="../js/jquery.mobile-1.3.0.min.js"></script>

      <script type="text/javascript" src="../js/maptest.js"></script> 
   </head>

   <body>

      <div data-role="page" id="main">
        <div data-role="header">
           <div data-role="navbar">
              <ul>
                 <li><a href="#" class="ui-btn-active ui-state-persist">Test</a></li>
                 <li><a href="#">Test</a></li>
                 <li><a href="#">Test</a></li>
              </ul>
           </div>
        </div>

        <div data-role="content">
           <ul data-role="listview"> 
              <li>Acura</li> 
              <li>Audi</li> 
              <li>BMW</li> 
              <li>Cadillac</li> 
              <li>Ferrari</liI>
           </ul> 
        </div>

        <div data-role="footer">
           <p>footer</p>
        </div>

     </div>
   </body>

</html>
4

1 に答える 1

0

以下をページに追加します。

 <code><meta http-equiv="X-UA-Compatible" content="chrome=1"></code>

IEでロードしているようです。このページは、IE ページに Chrome フレームの activex をロードして、JQuery で使用される Webkit スタイルシート ディレクティブをレンダリングします。

コンテンツ div 内にナビゲーション バーを配置することも真剣に検討する必要があります。

于 2014-01-31T02:19:50.743 に答える