動畫元素不會改變風格上懸停

Question

我有這樣的功能：

$(document).ready(function() { 
    function animatexyz() { 
    $('.xyz-ico a').animate({ 
     opacity: '.5' 
    },1000).animate({ 
     opacity: '.15' 
    },1000, animatexyz); 
    } 
    animatexyz(); 
} 

（XYZ-ICO a）條，直到我提出我的鼠標在它不斷閃爍的元素，那麼它應只是完全可見（不透明度1）。在我離開元素後，它必須繼續閃爍。

在我的CSS文件中，「.xyz-ico a：hover」僞元素的透明度爲1，但只要我使用這個動畫「循環」，當我將鼠標移到元素上時，沒有任何變化。

我的CSS代碼：

.xyz-ico { 
    position:fixed; 
    top:150px; 
    right:30px; 
    z-index:999; 
} 

.xyz-ico a { 
    opacity: .15; 
} 

.xyz-ico a:hover { 
    opacity: 1; 
} 

我試圖實現.hover和鼠標懸停jQuery函數到我的jQuery代碼，但沒有工作（只是兩個動畫步驟之間極短的瞬間我猜測）。似乎這個循環在任何地方都會「覆蓋」不透明度值。也許你有一個想法，我可以簡單地解決這個問題。

感謝很多:)

Answer 1

這應做到：

.xyz-ico a:hover { 
    opacity: 1 !important; 
} 

的原因是jQuery的直接設置樣式，其覆蓋在樣式表中設置的任何樣式的元素，由於級聯性質

（來自：：http://webdesign.about.com/od/css/f/blcssfaqcascade.htm）層疊樣式表（CSS），其是這樣的

有三種不同類型的樣式表：

1. 作者樣式表這是由Web頁面的作者創建的樣式表。他們是大多數人想到CSS樣式表時所想到的。

2. 用戶樣式表用戶樣式表由網頁的用戶設置。這些允許用戶更好地控制頁面的顯示方式。

3. 用戶代理樣式表這些是Web瀏覽器應用於頁面以幫助顯示該頁面的樣式。例如，在XHTML中，大多數可視用戶代理將<em>標籤顯示爲斜體文本。這是在用戶代理樣式表中定義的。

要解決衝突，Web瀏覽器使用下面的排列順序來 確定哪一種風格的優先級，將用於：

1. 首先，尋找適用於有問題的元素的所有聲明，併爲分配的媒體類型。

2. 然後看看它來自哪種樣式表。如上所述，作者樣式表先出現，然後是用戶，然後是用戶代理。使用！重要的用戶樣式比作者！重要的樣式具有更高的優先級。選擇器越具體，它將獲得的優先級越高。例如，「div.co p」上的樣式優先於「p」標籤上的樣式。

3. 最後，按照它們定義的順序對規則進行排序。稍後在文檔樹中定義的規則優先於先前定義的規則。導入樣式表中的規則在樣式表中直接在規則之前考慮。