闪烁/与JQM和PhoneGap的Andr​​oid上闪烁 [英] Blinking/flickering with JQM and PhoneGap on Android

查看:166
本文介绍了闪烁/与JQM和PhoneGap的Andr​​oid上闪烁的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我使用PhoneGap的2.2.0结合使用jQuery Mobile 1.2.0我在Android平台上的应用程序(版本2.3.3及以上)。 在我的网页使用固定的头,并没有转换的。休息是pretty的多标准的jQuery。

I am using PhoneGap 2.2.0 in combination with jQuery Mobile 1.2.0 for my app on the Android platform (version 2.3.3 and up). On the pages I use fixed headers, and no transitions at all. Rest is pretty much standard jQuery.

当我从一个页面浏览到另一个页面,我得到一个白色的闪烁(整个页面),对于一个短暂的瞬间。我在网上搜索了几个小时的。

When I am navigating from page to page I get a white blink (entire page), for a brief moment. I searched on the Internet for hours.

下面的失败尝试:

  • 在几十个CSS黑客,我发现在互联网上。 (如:<一href="https://github.com/jquery/jquery-mobile/issues/4024">https://github.com/jquery/jquery-mobile/issues/4024和<一href="https://groups.google.com/forum/?fromgroups=#!topic/phonegap/EtZ2KwseKQ0">https://groups.google.com/forum/?fromgroups=#!topic/phonegap/EtZ2KwseKQ0和<一href="http://stackoverflow.com/questions/5953753/flickering-when-navigating-between-pages">Flickering网页间导航时的)。
  • 在我试着开关固定头(同样,我不使用过渡效果)的..
  • 在我尝试jQuery Mobile的1.3.1。 (没有运气)
  • 有一件事我没有试过是PhoneGap的2.3.0,但我没有看到任何有趣的更新日志此事。编辑:在PhoneGap的2.5.0的问题仍然存在,
  • Dozens CSS hacks I found on internet. (like: https://github.com/jquery/jquery-mobile/issues/4024 and https://groups.google.com/forum/?fromgroups=#!topic/phonegap/EtZ2KwseKQ0 and Flickering when navigating between pages ).
  • I tried switching of fixed headers (again, I am not using transition effects)..
  • I tried jQuery Mobile 1.3.1. (no luck there)
  • One thing I did not tried is PhoneGap 2.3.0, but I don't see anything interesting for that matter in the changelog. issue persists on PhoneGap 2.5.0.

当我切换硬件加速关闭在Android项目中,闪烁消失了。但后来一些CSS样式不顺心和整体性能非常非常糟糕的(显然)。

When I switch hardware acceleration off in the Android project, the blinking is gone. But then some CSS styling goes wrong and overall performance is very very bad (obviously).

我想下面现在还。

ui.page {
-webkit-transform: translateZ(0);
-webkit-perspective:1000;
-webkit-backface-visibility: hidden;
}

要差仍然没有运气。

也试过这样:<一href="https://github.com/watusi/jquery.mobile.simultaneous-transitions">https://github.com/watusi/jquery.mobile.simultaneous-transitions 不过transistion前一个简短的(全白页)闪烁。

Also tried this one: https://github.com/watusi/jquery.mobile.simultaneous-transitions Still a brief (full white page) blink before transistion.

这真的看起来它无关,与页面本身的动画过渡,但一些奇怪的事情正在发生后,卸载旧的页面右侧和加载新之前。

It really seems that it has nothing to do with animation transitions of the page itself, but something strange that is happening right after unloading the old page and right before loading the new one.

更新25-04-2013: 也试过:     <一href="https://groups.google.com/forum/?fromgroups=#!topic/phonegap/EtZ2KwseKQ0">https://groups.google.com/forum/?fromgroups=#!topic/phonegap/EtZ2KwseKQ0     <一href="https://github.com/jquery/jquery-mobile/issues/4024">https://github.com/jquery/jquery-mobile/issues/4024     <一href="https://github.com/jquery/jquery-mobile/pull/4129">https://github.com/jquery/jquery-mobile/pull/4129

Update 25-04-2013: Also tried: https://groups.google.com/forum/?fromgroups=#!topic/phonegap/EtZ2KwseKQ0 https://github.com/jquery/jquery-mobile/issues/4024 https://github.com/jquery/jquery-mobile/pull/4129

这会使眨眼消失是去除fixedheader部分的唯一的事。然后,它是像奶油一样顺滑,但我错过了与面板相兼容的头。

The only thing that makes the blinking go away is removing the fixedheader part. Then it is as smooth as butter, but I miss the headers that are compatible with the panels.

也试过1页模板(在一个文件中的所有页面)。没有帮助。

Also tried the 1 page template (all pages in one file). Did not help either.

jQuery Mobile的1.3.1 PhoneGap的2.5.0 安卓4+ 设备: - 谷歌三星Galaxy Nexus的 - 三星Galaxy Tab 10.1(有问题,但没有设备了) - 三星Galaxy Note 10.1

jQuery Mobile 1.3.1 PhoneGap 2.5.0 Android 4+ Devices: - Google Samsung Galaxy Nexus - Samsung Galaxy Tab 10.1 (had the issue, but don't have device any more) - Samsung Galaxy Note 10.1

我已经提交了Github上的问题现在:<一href="https://github.com/jquery/jquery-mobile/issues/6031">https://github.com/jquery/jquery-mobile/issues/6031

I have submitted an issue on Github now: https://github.com/jquery/jquery-mobile/issues/6031

推荐答案

设置视用户可扩展=没有固定的问题,对我来说:

Setting viewport to user-scalable=no fixed the problem for me: 

修改

< meta name="viewport" content="width=device-width, initial-scale=1" />

< meta name="viewport" content="width=device-width, user-scalable=no" />

这篇关于闪烁/与JQM和PhoneGap的Andr​​oid上闪烁的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆