2010-10-15 71 views
2

我不確定這個問題是否真的是特定的,但我仍然想問一下。谷歌瀏覽器中的jquery動畫很慢

有沒有人注意到jquery動畫在Chrome上變得不太流暢,如果你只是發現一個jquery插件,它看起來很不錯,但通常在演示頁面上有一些標籤和另一個javascript funcions。我目前正在使用大量fadeIn()和fadeOut()函數(以300作爲參數)使用豐富的互動界面來開發項目。而在IE9,Opera和FF4中,它們運行得非常流暢,chrome無法正確呈現它們。

例如,chrome以非常「不平滑」的方式顯示這樣一個簡單的任務,例如使用函數fadeIn(300)顯示具有固定位置的400x100px div。

這只是我的問題,還是你最近注意到了類似的東西?我嘗試過穩定和開發版,但沒有運氣,正如我所說的,所有其他瀏覽器都可以處理流暢的動畫。

更新:這是一個例子:

$('#ms_cal_menu').click(function() { 
    var offset = $(this).offset(); 
    $('#cal_submenu').css("top", offset.top+'px').css('left', offset.left-5+'px').fadeIn(300);   
}); 
+0

你可以發佈你正在使用的代碼或發佈一個鏈接到你的網頁是更有幫助 – 2010-10-15 14:54:35

+0

我已更新帖子,這是最簡單的動畫,但問題是鉻在所有的動畫失敗。我也沒有在開發人員工具 – Mike 2010-10-15 15:03:21

+1

@mike中發現任何警告您的代碼工作正常,http://jsbin.com/ipewu3。可能是你的標記或CSS的錯誤 – 2010-10-15 15:12:51

回答

0

我認爲你正在創造一個競爭狀態。如果您正在使用子菜單並單擊從這裏到那裏,則每次啓動一個過程時 - 每個過程都必須有時間完成。

當你想移動到另一個菜單項時會發生什麼?它是否開始淡出?如果你的淡入未完成會發生什麼?

我知道你在其他瀏覽器中說「它有用」,但我敢打賭,我可以在幾秒鐘內讓它崩潰。您需要控制可能導致競爭條件的行爲,但除此之外,如果每次選擇某個菜單都會觸發華麗的動畫,則在一段時間之後,您的用戶將非常煩惱。首次觀看時「很漂亮」 - 但在日常使用中很痛苦。

難道你不能只使用.show().hide()