jQuery動畫延遲

我正在爲三個類似的選項卡式項目的一小部分功能。基本上，當你徘徊在一個，我希望兩兄弟姐妹的不透明度達到50％。我建立了一個非常基本的jQuery的懸停事件，這裏的頁面代碼...jQuery動畫延遲

<div id="footer"> 
    <a href="#" class="footer-tabs" id="footer-seek">Seek</a> 
    <a href="#" class="footer-tabs" id="footer-experience">Experience</a> 
    <a href="#" class="footer-tabs" id="footer-gain">Gain</a> 
</div>

......與對應的JS：

$('.footer-tabs').hover(
    function() { 
     $(this).siblings().animate({ opacity: .5 },500); 
    }, 
    function() { 
     $(this).siblings().animate({ opacity: 1 },500); 
    } 
);

當你將鼠標懸停在一個一切都很正常，但是當你從一個徘徊到另一個，兄弟姐妹不會同時昏暗。我做了一個快速截屏以供參考。我確信有一個簡單的方法可以使它正常工作，但我對此感到不知所措。提前致謝。

截屏：http://dl.dropbox.com/u/1762184/example.mp4

來源

2010-03-24 Andrew

要取消任何在對姐弟過程動畫。這是stop()函數的用途。

$('.footer-tabs').hover(
    function() { 
     $(this).siblings().stop().animate({ opacity: .5 },500); 
    }, 
    function() { 
     $(this).siblings().stop().animate({ opacity: 1 },500); 
    } 
);

來源

2010-03-24 15:44:37 Joel

工作就像一個魅力，謝謝！我知道必須有一個簡單的解決方案，而且這並不容易。 – Andrew 2010-03-24 15:46:57

試試這個：

$('.footer-tabs').hover(
    function() { 
     $(this).siblings().animate({ opacity: .5 },"fast"); 
    }, 
    function() { 
     $(this).siblings().animate({ opacity: 1 },"fast"); 
    } 
);

來源

2010-03-24 15:43:03 ant

jQuery動畫延遲

回答

相關問題