我在 JQM 中为 Phonegap 应用程序实现了一个滑动面板,但出于某种原因,当我尝试在 Android 4.x 上打开它时,它需要 1500 毫秒才能出现,但在 Android 2.x、iOS 和黑莓中它显示瞬间。
$(document).on("touchstart","img#openLeft", function()
{
$('#mydiv').panel("toggle");
}
能否请您告诉我,在不移除滑动动画的情况下,我可以采取什么策略来使面板显示得更快?
谢谢!
PS 我正在使用 JQuery Mobile 1.3.0
请您参考如下方法:
我最终修改了 JQM-1.3.0.css 来解决这个问题,结果发现它们不是硬件加速的。
在:
- @-webkit-keyframes slideinfromright
- @-moz-keyframes slideinfromright
- @keyframes slideinfromright
- @-webkit-keyframes slideinfromleft
- @-moz-keyframes slideinfromleft
- @keyframes slideinfromleft
- @-webkit-keyframes slideouttoleft
- @-moz-keyframes slideouttoleft
- @keyframes slideouttoleft
- @-webkit-keyframes slideouttoright
- @-moz-keyframes slideouttoright
- @keyframes slideouttoright
- .slide.out
- .slide.in
- .slide.out.reverse
- .slide.in.reverse
我更改了所有 -webkit-transform: translateX(x);
为 -webkit-transform: translate3d(x,0,0);
我还将我的动画更改为 data-display="push"
这似乎比 data-display="reveal"
更快,因为它在启动动画的同时翻译而不是等待内容翻译并在之后显示。