我的jQuery動畫功能無法正常工作

-1

當用戶將鼠標懸停在按鈕上，我試圖改變使用jQuery動畫功能按鈕箭頭形象，但它不工作。這是我的code，這是我的腳本。我的jQuery動畫功能無法正常工作

$('.Button').mouseenter(function(){ 
    $('.arrow-image').animate({ 
     'background-image':'url(images/sp-images.png)', 
     'background-repeat':'no-repeat', 
     'background-position':'-85px -0px' 
    },5000); 
});

來源

2012-02-03 Suresh Pattu

您已經張貼其他29個問題，你現在應該可靠地應用代碼格式化。詢問/編輯問題時，請參閱文本區域右側顯示的** How to Format **框以及其上方的** [？] **鏈接。 – 2012-02-03 06:59:29

另外：實時鏈接（http://jsbin.com或http://jsfiddle.net）對你的問題是一個很好的補充*，但在問題本身中總是包含相關的代碼/標記*。爲什麼：http://meta.stackexchange.com/questions/118392/add-stack-overfow-faq-entry-or-similar-for-putting-code-in-the-question – 2012-02-03 07:00:14

我不相信，背景 - 圖像和背景重複是可以製作動畫的東西，因爲它們沒有起始值和結束值 - 它們只有一個值。你試圖完成什麼？ – jfriend00 2012-02-03 07:02:32

你的 '背景位置'： ' - 85px -0px'，將其更改爲

'background-position-x':'-85px', 
'background-position-y':'0px'

來源

2012-02-03 07:04:25 XepterX

XepterX是正確的： http://jsfiddle.net/YSGYz/7/

來源

2012-02-03 07:07:51 s3mre8

從jQuery documentation for .animate()：

動畫屬性和值所有動畫屬性應爲動畫到si數字數字，除非如下所述;最性質是非數字不能使用基本的jQuery 功能是動畫（例如，寬度，高度，或左可以是動畫但背景顏色不能，除非使用jQuery.Color（）插件）。除非指定了其他，否則將屬性值視爲多個像素。可以指定單位em和％。

從這個人可以看出，你不能動畫到一個新的形象或重複的價值。您可以爲包含數字和其他幾個屬性的樣式屬性設置動畫。這就是jQuery .animate()的工作原理。

如果你想從一個圖像到另一個慢慢改變，那麼你需要兩個對象，一個是可見的是舊的圖像和一個不可見那就是新的圖像。您使用CSS來使兩個對象完全重疊。然後，您可以在新圖像上使用.fadeIn()，在舊圖像上使用.fadeOut()。

正如XepterX所示，background-position-x和background-position-y由單個數字表示，因此它們可以是動畫的，但圖像URL或重複值不能動畫。

來源

2012-02-03 07:21:13 jfriend00

希望，這段代碼將是任何幫助。我知道，爲了某種目的，您已經使用了背景圖片，但我試圖通過其他方式使事情按預期工作。 :)這裏是我的嘗試，使箭頭動畫！

一個變化 - 而使用的背景圖片，我已經使用img標籤。

點擊此處查看：http://jsfiddle.net/ylokesh/HvdZP/1/

來源

2012-02-03 07:42:47

我的jQuery動畫功能無法正常工作

回答

相關問題