2011-05-01 36 views
1

jQuery的新品牌。已經在下面的函數中實現了我正在開發的一個頁面,而我認爲相對簡單的jQuery證明是有問題的。簡單的jQuery超級緩慢的Firefox,IE瀏覽器,超快速的Chrome

$(document).ready(function(){ 

    var leftnav = $("#leftnav ul li"); 

    leftnav.hover(function(){ 
     $(this).children('ul').stop(true, true).slideDown(); 

    },function(){ 
       $(this).children('ul').stop(true, true).slideUp(); 
    }); 

}); 

基本上,這在Chrome和Opera中運行良好 - 可愛,流暢,快速。在Firefox和IE8中,它像一條狗一樣奔跑 - 生澀,緩慢,就像穿着一套泥。正如我所說我是jQuery全新的 - 這是我第一次試圖實現任何一個網頁。我已經使用mouseenter和mouseleave嘗試過,但沒有什麼區別。

我會預料到IE8的問題,但有點消除,因爲我一直髮誓,Firefox給我的問題。我只需要接受這一點並做出相應的決定?

謝謝

編輯:好吧,我設法加快了一點。雖然仍然沒有油脂閃電Chrome的性能,IE8和Firefox現在是我所說的可接受的。我從這個優秀的頁面得到了一些提示 - http://www.artzstudio.com/2009/04/jquery-performance-rules/

我只是通過在自己的標記 - #列表中給出'#leftnav ul'它自己的ID,然後在我的jQuery代碼中引用它來更加具體。所以,

var leftnav = $("#leftnav ul li"); 

變爲:

var leftnavUl = $("#list li"); 

從我所收集這使得jQuery來更有效地磨練中所涉及的元素。

在firebug中使用console.time,我注意到每個slideDown操作的速度從〜15ms增加到~10ms,只是在我的選擇器中更具體。

就像我說的那樣,不像Chrome一樣qucik,但越來越好!

回答

0

如果它沒有拋出錯誤或毛刺,那麼你可能做的並不多。

該代碼看起來並不像它有任何大規模的循環或任何會導致它滯後的事情,它只是瀏覽器如何處理jQuery。

你爲什麼不使用:

$( 「#leftnav UL李UL」)懸停(...等...)

這樣,你可以切出 '孩子'。電話和變種。 這是除非你用他們的東西。

+0

感謝您的建議 - 不幸的是,我已經嘗試過直接引用元素,使用或不使用var和使用或不使用children調用的每種組合,並且它沒有任何區別。想知道它是否可能與我的DOM構造有關...任何jQuery專家都會在這方面提出任何建議? – Ste77 2011-05-02 07:59:49

+0

你可以發佈一個鏈接到現場演示? – Neros 2011-05-03 11:04:55

相關問題