2013-03-28 32 views
2

我在JQM中爲Phonegap應用程序實現滑動面板,但由於某些原因,當我打開嘗試在Android 4.x上打開它時,它需要1500ms出現,但在Android 2.x ,iOS和黑莓它瞬間顯示。Phonegap中的慢JQuery移動面板

$(document).on("touchstart","img#openLeft", function() 
{ 
    $('#mydiv').panel("toggle"); 
} 

請問我可以採用什麼策略使面板顯示更快,而不需要移除滑動動畫?

謝謝!

PS我使用jQuery Mobile的1.3.0

回答

9

我最終修改了JQM-1.3.0.css來解決這個問題,結果他們沒有硬件加速。

上:

  • @ -webkit-關鍵幀slideinfromright
  • @ -moz-關鍵幀slideinfromright
  • @keyframes slideinfromright
  • @ -webkit-關鍵幀slideinfromleft
  • @ -moz-關鍵幀slideinfromleft
  • @keyframes slideinfromleft
  • @ -webkit-關鍵幀slideouttoleft
  • @ -moz-關鍵幀slideouttoleft
  • @keyframes slideouttoleft
  • @ -webkit-關鍵幀slideouttoright
  • @ -moz-關鍵幀slideouttoright
  • @keyframes slideouttoright
  • 。 slide.out
  • .slide.in
  • .slide.out.reverse
  • .slide.in.r EVERSE

我改變了所有的-webkit-transform: translateX(x);-webkit-transform: translate3d(x,0,0);

,我也改變了我的動畫data-display="push"這似乎比data-display="reveal"工作得更快,因爲它啓動動畫在翻譯,而不是等待要翻譯的內容和節目它之後。

+0

+1用於數據顯示器推送。這對我來說有很大的不同,而不會丟失動畫。 – Wayneio 2013-04-04 18:11:25

+1

https://github.com/jquery/jquery-mobile/issues/1603 – TWilly 2013-10-25 17:59:20

0

正如文件給出,這些都是由硬件加速。可能是您的4.0設備性能不佳。

您可以通過將data-animate="false"添加到窗格的div來禁用動畫。它在documentation中提到。

+0

似乎文檔是錯誤的,它不是硬件加速的。我在同一個線程上發佈瞭解決方案。 – Cenobyte321 2013-04-03 16:09:36