mouseenter（）在两个元素上创建元素滑动的混蛋

Question

您好我正试图在事件触发mouseenter幻灯片上的两个不同元素上绑定div3 jquery事件。但是当光标从div1移动到div2时，div3首先向上滑动，然后向下滑动。

小提琴：http://jsfiddle.net/gzcnouux/

预期行为：Div仅在光标不在div

时向上滑动

Answer 1

有很多不同的方法可以实现这一点，但为了说明这一点，mouseleave事件在mouseenter之前触发，导致div向下滑动。您可以对relatedTarget进行简单检查。

if (e.relatedTarget && e.relatedTarget.id != 'd2' && e.relatedTarget.id != 'd1')
    $('#d3').slideUp();

ID Fiddle

使用classList及其contains方法的更易于维护的方法。

if (e.relatedTarget && !e.relatedTarget.classList.contains('box'))
    $('#d3').slideUp();

Class Fiddle

Answer 2

您可以使用mouseover事件。

如果不是mouseover或document，您应该绑定check DOM 元素的d1事件和d2。

这可以使用event.target属性来实现，以便找出启动该事件的 DOM 元素。

$(document).on('mouseover', function(e) {
    if(e.target.id!='d1' && e.target.id!='d2')
       $('#d3').slideUp();
});

请参阅full工作解决方案。