1

我有以下代码：

<div data-role="page" id="Page1" >

   <!-- Footer here -->
      <div data-role="footer" data-position="fixed" data-id="id-footer1">
         <div data-role="navbar">
            <ul>
               <li><a href="#Page1" class="ui-btn-active ui-state-persist">Page1</a></li>
               <li><a href="#Page2" data-transition="pop">Page2</a></li>
            </ul>
         </div>
      </div><!-- /footer -->
</div><!-- /page -->

<div data-role="page" id="Page2" >

   <!-- Footer here -->
      <div data-role="footer" data-position="fixed" data-id="id-footer1">
         <div data-role="navbar">
            <ul>
               <li><a href="#Page1" >Page1</a></li>
               <li><a href="#Page2" data-transition="pop"class="ui-btn-active ui-state-persist">Page2</a></li>
            </ul>
         </div>
      </div><!-- /footer -->
   </div><!-- /page -->

如果我使用以下脚本，上述代码将起作用。也就是说，第 1 页将具有 Slide 效果，第 2 页将具有 Pop 效果。

<link rel="stylesheet" href="http://code.jquery.com/mobile/1.0/jquery.mobile-1.0.min.css" />
<script type="text/javascript" src="http://code.jquery.com/jquery-1.6.4.min.js"></script>
<script type="text/javascript" src="http://code.jquery.com/mobile/1.0/jquery.mobile-1.0.min.js"></script>

但是，当我使用以下时，幻灯片效果和弹出效果消失了。

<link rel="stylesheet" href="http://code.jquery.com/mobile/1.1.0/jquery.mobile-1.1.0.min.css" />
<script src="http://code.jquery.com/jquery-1.7.1.min.js"></script>
<script src="http://code.jquery.com/mobile/1.1.0/jquery.mobile-1.1.0.min.js"></script>

似乎新的 JQM 版本影响了页面转换，还是我遗漏了什么？有人可以确认吗？

谢谢。

4

1 回答 1

1

阅读1.1.0 公告中的转换部分：

不幸的是，经过大量工作后，我们确定在 Android 2.x 中，即使在运行 2.3 的 Nexus S 等较新的设备上，也无法将页面转换降低到足以在 Android 2.x 中获得可接受的性能。经过深思熟虑，我们决定对目标转换使用 3D 转换的功能测试：如果浏览器通过，它将看到完整的转换范围。默认情况下，如果浏览器未通过此 3D 测试，它们将退回到淡入淡出过渡，而不管指定的过渡。所有 Android 1.x-2.x 设备均未通过此测试，但 Android 3.x 和 4.x 通过。如果您想更改此行为，则每个转换的回退行为是完全可配置的。

如果您的测试浏览器不支持 3D 变换，您将获得淡入淡出过渡。

于 2012-04-18T14:59:53.130 回答