1

我正在尝试在 jquery mobile 的弹出动画中完成一个简单的幻灯片。我在桌面浏览器（chrome 和 firefox）上对此进行了测试并且工作正常。但是在移动设备中，按下按钮时我得到以下结果：
弹出窗口很好，但在屏幕右侧创建了一个空白区域，如果用户向右滑动，则该空白区域可见。关闭弹出窗口会删除此空白。仅当使用“幻灯片”转换触发弹出窗口时才会发生这种情况。有谁知道这种行为的原因。

按下按钮后弹出
由于幻灯片过渡而产生的空白

我可以手动调整窗口大小，但我不确定在弹出窗口滑入后会触发什么事件。

（我有图片可以展示，但我没有 10 个代表，所以我不能发布它们：（）

有谁知道为什么会这样。我正在使用 Droid Razr Maxx（运行 Jelly Bean）进行测试。我已经在设备上使用 chrome、firefox 和默认浏览器进行了测试。它们都产生相同的结果。这是我的代码：

<!DOCTYPE html>
 <html ng-app>
   <head lang="en">
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link href="http://code.jquery.com/mobile/1.3.1/jquery.mobile-1.3.1.css" rel="stylesheet" type="text/css" />
    <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
    <script src="http://code.jquery.com/mobile/1.3.1/jquery.mobile-1.3.1.min.js"></script>
   </head>
   <body>
     <div data-role="page">
      <a href="#pop" data-role="button" data-rel="popup" data-transition="slide">Pop Up</a>
      <div data-role="popup" id="pop" data-overlay-theme="a">
       <p>Basic Popup Basic Popup Basic Popup Basic Popup Basic Popup Basic Popup Basic Popup</p>
      </div>
     </div>
  </body>
</html>
4

1 回答 1

0

经过进一步研究，我发现这个问题已在最新版本的 jquery mobile (1.4) 中得到修复，该版本仍处于 alpha 阶段。

http://jsbin.com/edeluh/32

于 2013-07-19T16:17:00.703 回答