爲iPad優化的jQuery？

我正在爲iPad設計一個Web應用程序，並且我一直使用的大部分效果都來自jQuery。並非所有的動畫都很流暢，這就是爲什麼我想知道是否有經過優化的jQuery版本能夠在iPad上更流暢地運行？爲iPad優化的jQuery？

2011-10-13 Charlie

你必須做出CSS3動畫。對不起，我的跛腳答案。我現在已經睡了差不多2天了。（48小時）。 – andlrc

有jQuery Mobile的：http://jquerymobile.com/

此外，CSS3動畫按照AndreasAL的評論。儘可能使用這些代替JavaScript。

有用的文章爲CSS3動畫與'正常'（不移動）jQuery後備;應該適用於您的場景：http://addyosmani.com/blog/css3transitions-jquery/但是，請注意，許多移動設備的緩存大小限制已超出'普通'jQuery。不確定關於iPad。

[更新說明]

我碰到Zepto.js前一段的來源，但忘了這個蘇答案，直到有人碰到它。在很多情況下，Zepto.js是移動jQuery應用程序的替代品。它在一定程度上與移動設備兼容（它實際上是針對iOS和Android使用的默認瀏覽器的webkit），但我不會將其用於桌面用戶。您可以使用條件預加載器（require.js？）來加載用於桌面的jQuery和用於移動的Zepto。

最壞的情況下，放入它，看它是否適合您的需求;該語法與jQuery兼容，因此您不需要修改自定義代碼就可以瞭解它是否可行。

[進一步更新]

如果你正在做的用戶代理檢測或這僅僅是將成爲iOS和Android平臺來說，也是這樣：

http://www.jqmobi.com/

來源

2011-10-13 14:01:41

jQ mobile的問題是我不得不重寫大部分代碼才能使用它。我可能會嘗試將一些效果切換到CSS3，只是不確定是否有一個div翻轉（我會谷歌它）。你對緩存限制有什麼意義？ – Charlie

因此，通常一旦您提取了腳本（或其他資源），瀏覽器就可以對其進行緩存，以便它不需要在其他頁面上再次獲取它。對於單個組件，iPhone不會（最後檢查）緩存大於25KB的任何內容。我剛剛注意到至少有一位研究員說這實際上是15KB。我並不聲稱自己是專家，但我多次讀過jQuery超過了iPhone的限制。我推斷可能其他移動設備也有類似的問題。再一次，雖然，不確定關於iPad。 –

用關於Zepto的一點更新了答案。 –

試試這個寬鬆的jQuery插件硬動畫效果優化，併爲您提供流暢的動畫效果

看here

來源

2011-10-13 14:00:07

我將如何實施？我需要重寫現有的代碼還是隻需在頭部調用腳本？ – Charlie

@Charlie只需添加標題... –

添加它似乎並沒有使動畫更流暢 – Charlie

你可能想嘗試降低動畫的刷新率，您可以這樣做：

//animate memory hog fix 
jQuery.fx.prototype.custom = function(from, to, unit) { 
    this.startTime = now(); 
    this.start = from; 
    this.end = to; 
    this.unit = unit || this.unit || "px"; 
    this.now = this.start; 
    this.pos = this.state = 0; 
    var self = this; 
    function t(gotoEnd) { 
     return self.step(gotoEnd); 
    } 
    t.elem = this.elem; 
    if (t() && jQuery.timers.push(t) && !jQuery.fx.prototype.timerId) { 
     jQuery.fx.prototype.timerId = setInterval(jQuery.fx.tick, 75); 
    } 
}

將最後一行上的75更改爲任何您想要的值。另外要小心你的動畫，只要一次嘗試一件事。不透明度總是一個記憶豬，所以儘可能在所能的位置替換幻燈片效果。

來源

2011-10-13 14:02:30

這是否適用於所有jQuery動畫？它只是被放在頭標上嗎？ – Charlie

是的，它改變了所有jQuery動畫的定時器，包括像slide（）這樣的內置定時器。只要把你的jquery包含進去就可以了。 –

把它放在一些我的代碼後。把它放在之前不會，但這可能是因爲它被覆蓋... – Charlie

我使用jQuery Animate Enhanced Plugin由本·巴尼特

來源

2011-10-13 15:30:25 Xaver

我喜歡這個。它可能適用於某些部分，但不適用於所有部分，對於那些不適用的部分（例如Flip！插件），它會將其擰緊。 – Charlie

爲iPad優化的jQuery？

回答

相關問題