Question

当我将鼠标悬停在其中的div上时，有没有办法隐藏父div。

<div class="parent" style="width:500px; height:800px;">
<div class="child" style="width:250px; height:250px; margin:250px auto 0 auto;">
</div>
</div>

我想将鼠标悬停在子节点上，使其消失为父节点和子节点元素。

如果有一种方法，即使使用jquery / javascript，请告诉我。

我有4个父div和他们各自的子div，当我将鼠标悬停在另一个父div上时，隐藏的div重新出现。

Answer 1

您可以使用mouseenter事件，然后像这样隐藏最近的父母

$('.child').on('mouseenter',function(){
    $(this).closest('.parent').hide();
});

DEMO

Answer 2

$('.child').on('mouseover',function(){
    $(this).parent().hide();
});

Answer 3

为此你可以使用jquery 悬停。

$('.child').hover(function(){
    $(this).parent().hide();
});

DEMO

注意：悬停功能可以同时处理鼠标悬停和鼠标中心，最好处理UI元素。例如：Fiddle

Answer 4

$('.child').hover(function(){
   $(this).parent().hide();
}, 
function(){
   $(this).parent().show();
});

演示：

http://jsfiddle.net/JsmVm/

当我将鼠标悬停在它的子div元素上时，我可以隐藏父div吗？

4 个答案: