3

我在使用 jQuery 移动开发的应用程序时遇到了 iPhone 上的闪烁问题。我尝试了互联网上的几种解决方案，包括 CSS 更改、将转换设置为“无”，甚至在 jquerymobile.js 中注释代码。但没有运气......我正在使用的 JS 和 CSS 文件如下：

<script src="jquery-1.7.1.min.js"></script>
<script src="jquery.mobile-1.1.0.js"></script>
<script type="text/javascript" charset="utf-8" src="cordova-2.3.0.js"></script>
<link rel="stylesheet" href="jquery.mobile.structure-1.1.0.min.css" />

对此的任何帮助将不胜感激。谢谢。

4

4 回答 4

1

当我在转换期间搜索闪烁的页眉和页脚时，我发现了这个 SO 线程以及：http: //view.jquerymobile.com/1.3.1/dist/demos/widgets/fixed-toolbars/footer-persist-一个.html

就这么简单：如果您要导航到的页面的页眉或页脚与您要导航的页面具有相同的 data-id，则工具栏将在转换之外显示为固定。

<div id="sell" data-role="page" > 
    <div data-role="header" data-id="header" data-position="fixed">
        <h1>Seconds.me</h1>
        <a data-role="button" href="#buy" data-icon="arrow-l" data-theme="app-ios" style="color: white; text-decoration: none;">Back</a>
    </div>

      <h3>1</h3>
      <a href="#buy">2</a>

  </div>  

  <div id="buy" data-role="page" > 
    <div data-role="header" data-id="header" data-position="fixed">
        <h1>Seconds.me</h1>
        <a data-role="button" href="#sell" data-icon="arrow-l" data-theme="app-ios" style="color: white; text-decoration: none;">Back</a>
    </div>

      <h3>2</h3>
      <a href="#sell">1</a>

  </div>

一直闪烁，现在不闪烁了。看看data-id="header"两个页面的哪个相同。

（希望有帮助）

更新： http: //jquerymobile.com/demos/1.2.0/docs/pages/page-transitions.html --> 这个页面也解决了闪烁问题......

于 2013-06-16T15:41:02.657 回答
0

在这里，我带来了解决方案.......

请按照顺序

// First of all jQuery
<script src="http://code.jquery.com/jquery-1.8.2.min.js"></script>

// then load custom jQuery Mobile
<script type="text/javascript" src="mobile/js/mobile-jqm.js"></script>

// then load jQuery Mobile
<script src="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.js"></script>

// finally load your own scripts (.js) files 
<script type="text/javascript" src="mobile/js/script.js"></script>

要禁用转换，请在 mobile-jqm.js 文件中创建 mobile-jqm.js filt &，放置以下代码：

$(document).bind("mobileinit", function(){
  $.extend(  $.mobile , {
   defaultPageTransition: 'none'
  });
});
于 2013-02-20T17:57:43.227 回答
0

尝试下载并使用最新版本的 jquery(1.8.2) 和 jquery mobile(1.2.0) 及其 css(1.2.0)。

问候

于 2013-01-29T08:26:57.407 回答
0

您是否执行了以下解决方法：

.ui-page { -webkit-backface-visibility: hidden; }

如此处所述

重要提示：某些平台目前存在过渡问题。我们正在努力为每个人解决问题的解决方案。如果您在过渡期间或过渡结束时遇到闪烁和闪烁，我们建议您采用以下解决方法。请注意，此解决方法应在部署前在目标平台上进行全面测试。已知此解决方法会导致性能问题，并且浏览器在某些平台（尤其是 Android）上崩溃。

于 2013-01-29T08:30:35.233 回答