悬停在jQuery中突出显示div

Question

我希望<div>突出您的选择的原因是因为效果需要在许多类型的元素上。

我想要发生的是鼠标事件将完全忽略高亮div。

据我所知，唯一可行的方法是使用trigger()。

$('#hover').mouseenter(function(){
    // that refers to the element below it.
    $(that).trigger('mouseenter');
});

但是，悬停高亮显示div本身也会被鼠标中心激活：

$('.item').bind('mouseenter.hover', function() {
    hoverEffect(this);      
})

这是jsfiddle。

如何触发所有mouseenter事件除之外的mouseenter.hover？

或者，如何通过所有鼠标事件使div 完全忽略？所以它只会听取它下面的那个。

感谢您的时间。

Answer 1

您可以尝试使用Pointer-Events css属性，如下所示：

#hover{
   pointer-events: none;
}

这将教会#hover忽略鼠标事件，并将它们通过自身传播到底层元素。

这在某些浏览器中存在问题，可能会产生意外的副作用。请在负责查阅文件后使用。