3

所以,我正在使用 phonegap 和 jqm 开发一个应用程序。一切都很好,这一切都非常简单,这要归功于 phonegap 构建。但是,我开始看到一些非常烦人的“口吃问题”。我的应用目前只有两个页面,它们之间的过渡效果是“幻灯片”。第一页设置了背景颜色,第二页没有。一些问题:

  1. 当我从第 1 页导航到第 2 页时,页面的一半具有上一页的背景颜色。在我在屏幕上进行一些随机滑动后,它就消失了。
  2. 在其中一个页面上,我有一个带有一些文本输入字段的常规表单,最后设置了一个单选按钮。当我从输入框移动到单选按钮时,键盘会向下滑动,但会在短时间内被黑色区域取代。
  3. 我在顶部的固定标题随机决定消失并再次出现。

这些只是烦人的一小部分,它们只发生在移动设备上,并且在计算机上运行良好。所以,我知道这是一个性能问题。

我已经在 Internet 和 SO 上阅读了有关此内容的信息,并且提出了不同的解决方案,例如编写自定义 CSS3 转换(以利用硬件加速)或使用类似 zepto.js 的东西。

您认为克服这些问题的最佳“跨设备兼容”方法是什么?有没有办法用jquery mobile强制硬件加速?CSS3 性能是否跨设备平台?

PS。我一直在测试果冻豆 4.2.2。我没有发布我的任何代码,因为它们只是简单的表单元素和一些输入标签,这发生在多个完全不同的页面上,所以我很确定这与代码无关。

任何帮助都感激不尽。

4

1 回答 1

0

JQuery 使用 Javascript 编写动画,Javascript 动态编写快速变化的内联样式。问题在于它没有使用硬件加速,如果您在视网膜设备上进行测试,它会使用像素进行动画处理,因为它们是一个度量单位。所以它跳过了一半的像素,这会导致口吃。

我已经使用 PhoneGap 编写了应用程序,我想出的最好方法是使用 CSS3 动画/过渡。超级流畅,感觉就像一个原生应用程序。您仍将使用 JQuery 来添加/删除类等,但移动应该来自您的 CSS。

于 2014-02-07T00:50:12.437 回答