jQuery的選擇類之外的「本」

Question

好了，所以這是我建立

HTML：

​​

的「視頻播放按鈕」是「動態圖像」，這是一個覆蓋100％x 100％的圖像以及我想要做的是當您懸停「視頻播放按鈕」時，它會更改「視頻圖像」的不透明度，然後顯示「視頻 - 底層」

jQuery：

jQuery(".video-play-button").hover(
    function() { 
     jQuery(".video-image").stop().animate({opacity: '0.7'}, 300);}, 
    function() { 
     jQuery(".video-image").stop().animate({opacity: '1'}, 400); 
}); 

這可行，但因爲我將有多個具有相同代碼和類的元素，所以它們都不會影響它們。

我是新來的JS和jQuery所以我appolagise

Answer 1

除了Adil's答案，這應該工作以及：

jQuery(".video-play-button").parent().hover(
    function() { 
     jQuery(this).next().stop().animate({opacity: '0.7'}, 300);}, 
    function() { 
     jQuery(this).next().stop().animate({opacity: '1'}, 400); 
}); 

Answer 2

您可以將hover限制在當前塊，先用最接近尋父a錨標記（），然後移動到anhor的兄弟與video-image

類

jQuery(".video-play-button").hover(
    function() { 
     jQuery(this).closest('a').next(".video-image").stop().animate({opacity: '0.7'}, 300);}, 
    function() { 
     jQuery(this).closest('a').next(".video-image").stop().animate({opacity: '1'}, 400); 
});