jQuery的動畫不爲我

我創建了動態背景鼠標懸停此代碼的工作，但它不工作，只改變爲其他的背景，但是當我使用功能animate不顯示效果：jQuery的動畫不爲我

$(".b_header").mouseover(function() { 

$(this).css("background-image","url(images/bot/head_down.png)"); 



/* 

Also I've tried other effects and nothing 

$(this).css({backgroundPosition: "0 0"}); 


$(this).animate(
{backgroundPosition:"(-20px -53px)"}, 
{duration:500}); 
*/ 

$(this).animate({ opacity: 5 }, 3000); 

});

來源

2012-08-03 Fran

[jquery animate background position]的可能的重複（http://stackoverflow.com/questions/5171080/jquery-animate-background-position） – epascarello 2012-08-03 17:54:52

'opacity'從0變爲1. – 2012-08-03 17:55:11

'opacity'從'0' （透明）到'1'（不透明） – Mathletics 2012-08-03 17:55:13

首先，請確保你使用的document.ready

$(document).ready(function() { 
    ...... 
    $(this).animate({ opacity: 1 }, 3000); 
});

第二，在你的CSS文件中所做的確定你設置了跨瀏覽器不透明度屬性

opacity: 0; /* Chrome 4+, FF2+, Saf3.1+, Opera 9+, IE9, iOS 3.2+, Android 2.1+ */ 
filter: alpha(opacity=0); /* IE6-IE8 */

最後，不透明度值範圍從0（隱藏）到1（不透明），有NO 5值，但它會很好地工作，如果是1

和這裏的一個工作示例=>http://jsfiddle.net/abdullahdiaa/PxGwz/

來源

2012-08-03 18:02:49 AbdullahDiaa

jQuery的動畫函數不支持具有多個值的CSS屬性。您通常可以單獨爲每個單獨的值設置動畫。所以，這就解釋了爲什麼試圖動畫背景位置這兩個值都不起作用。

從jQuery doc for .animate()：

所有動畫處理的屬性應該被動畫化以單一數值，

對於動畫不透明度，它需要的值從0到1，而不是一個值5並且看到動畫以不透明的方式工作，則對象將不得不以不同的不透明度開始，而不是您正在進行的動畫。

這裏的動畫不透明度的工作示例：http://jsfiddle.net/jfriend00/zCL7S/

來源

2012-08-03 17:54:38 jfriend00

和動畫背景圖像？，我想這樣做，但我不知道它的使用問題，直到功能jQuery的CSS和這個沒有工作？ – Fran 2012-08-03 19:08:04

@Fran - 動畫背景圖像如何？ – jfriend00 2012-08-03 19:57:53

jQuery的動畫不爲我

回答

相關問題