0

我正在尝试使用 jquery mobile 创建一个简单的导航栏,但在桌面上看起来很奇怪。

http://imgur.com/7BIgUQx

当我跳转到起始页“./overview”时,整个菜单变大了,并且有一条奇怪的线将其抛出。如果我单击第二个菜单项,菜单会变小并且看起来正确。我去看看是否可以在 Firefox 中重现它,并注意到它不是概览页面所独有的。如果我在域之后键入“./stats”,它会进入统计页面,并且菜单会再次以不同的方式呈现。回到概览页面,菜单看起来很正常。所以似乎正在发生的事情是菜单看起来只有在我在 url 栏中输入的页面上是错误的。如果我切换到其他页面,则 url 会在栏中更新,但看起来不错。用菜单切换回来,菜单又变大了,那条线扔了它。

我查看了这两个页面的来源,它们看起来相同,所以我不知道还要检查什么。

概述

<html>
  <header>
    <title>Overview</title>
    <link rel="stylesheet" href="http://code.jquery.com/mobile/1.3.0/jquery.mobile-1.3.0.min.css" />
    <script src="http://code.jquery.com/jquery-1.8.2.min.js"></script>
    <script src="http://code.jquery.com/mobile/1.3.0/jquery.mobile-1.3.0.min.js"></script>
  </header>
  <body>
    <h1>Overview</h1>
    <h3></h3>

    <div data-role="header" data-id="foo1" data-position="fixed">
      <div data-role="navbar">
    <ul>
      <li><a href="/10/overview" class="ui-btn-active ui-state-persist">Overview</a></li>
      <li><a href="/10/stats">Status</a></li>
    </ul>
      </div><!-- /navbar -->
    </div><!-- /footer -->
  </body>
</html>

统计数据

<html>
  <header>
    <title>Stats</title>
    <link rel="stylesheet" href="http://code.jquery.com/mobile/1.3.0/jquery.mobile-1.3.0.min.css" />
    <script src="http://code.jquery.com/jquery-1.8.2.min.js"></script>
    <script src="http://code.jquery.com/mobile/1.3.0/jquery.mobile-1.3.0.min.js"></script>
  </header>
  <body>
    <h1>Stats</h1>
    <h3></h3>

    <div data-role="header" data-id="foo1" data-position="fixed">
      <div data-role="navbar">
    <ul>
      <li><a href="/10/overview">Overview</a></li>
      <li><a href="/10/stats" class="ui-btn-active ui-state-persist">Stats</a></li>
    </ul>
      </div>
    </div>
  </body>
</html>

有谁知道是什么导致这个菜单扩大?

4

1 回答 1

1

在两个页面的 head 标签之间包含以下标签:

<title>Stats</title>
    <link rel="stylesheet" href="http://code.jquery.com/mobile/1.3.0/jquery.mobile-1.3.0.min.css" />
    <script src="http://code.jquery.com/jquery-1.8.2.min.js"></script>
    <script src="http://code.jquery.com/mobile/1.3.0/jquery.mobile-1.3.0.min.js"></script>
于 2013-03-01T05:26:24.137 回答