jquery停止從懸停出來的堆疊元素

我一直在這個問題上拖了很久。jquery停止從懸停出來的堆疊元素

$(".poster-wrapper.tint").hover(function() { 
    $(this).siblings(".controls").slideDown('fast'); 
}, function (e) { 
    //Here is where I need if statement. Only slide up if the poster **and** the controls class is not being hovered on 
    $(this).siblings(".controls").slideUp('fast'); 
});

.controls是ontop的的.poster-wrapper的，所以當我將鼠標懸停在海報包裝它正確顯示的控件類，但是當我將鼠標懸停在控制類，他們滑走了一遍顯然是因爲海報不再被徘徊上。我該如何阻止這種不需要的行爲？

我看過這裏的其他線程，但仍然無法解決多個元素。

的jsfiddle：https://jsfiddle.net/9dzfys87/

來源

2016-02-01 Martin Dawson

內一個DIV - 更新與click事件工作？ – Jaydo

@Jaydo完成。如果你在黑色方塊內懸停，下滑可以正常工作。如果你將鼠標懸停在中間的藍色方塊上，它會嘗試恢復。即使在藍色方塊上，我也希望它保持顯示 –

我發現了另一個問題StackOverflow上的here解決方案。

將pointer-events: none;添加到您的.controls類中。

.controls{ 
    pointer-events: none; 
    /* other properties */ 
}

更新fiddle。

地方，你可以發佈的jsfiddle其他

<div class="poster-wrapper tint"> 
     <div class="controls"></div> 
    </div>

JSFiddle

來源

2016-02-02 00:22:09 Jaydo

這也會禁用所有click（）事件。我不想那樣。 –

是的，它不幸的。如果你不介意把'.controls'放在'.poster-wrapper'裏面，它就可以工作。 [鏈接]（https://jsfiddle.net/9dzfys87/8/） – Jaydo

夠好，從來沒有想到這一點。謝謝。 –

jquery停止從懸停出來的堆疊元素

回答

相關問題