只有在没有悬停在某个元素上时执行悬停（）

Question

有我遇到的这个问题，同时使用悬停效果编码一个小表，导致它更改行。 但是，在原创中，我也想使用链接。当用户悬停在这些链接上时，我不需要希望悬停效果发生。

相关代码，其中popup是行的类（将鼠标悬停在该行上可激活hoverIntent以将这些行更改为其他行）。该来的链接中有一个名为linky类被排除span：

<script type="text/javascript"> 
    $(document).ready(function(){ 
     $(".popup").hoverIntent(hover, original); 

    }); 



    function hover(){ 
     $(this).addClass("hovering"); 
     $(".hovering .original").fadeOut(50, function() { 
      $(".hovering .hover").fadeIn(300); 
     }); 
    } 

    function original(){ 
     $(".hovering .hover").fadeOut(50, function() { 
      $(".hovering .original").fadeIn(300); 
      $(".popup").removeClass("hovering"); 
     }); 
    } 

</script> 

<table> 
    <tr class='header'> 
    <th>row</th> 
    <th>row</th> 
    <th>row</th> 
    <th>row (the ones below are just a javascript fix, because it otherwise changes position on hover, when using this system. They are not visible.)</th> 
    <th>row</th> 
    <th>row</th> 
    </tr> 
    <tr class='popup'> 
    <td class='original'>First column</td> 
    <td class='original'><span class='linky'><a>mylink</a></span><!-- this span should be excluded --></td> 
    <td class='original'>Third column</td> 
    <td class='hover' style='display:none;'>this one gets displayed when hovering 1</td> 
    <td class='hover' style='display:none;'>this one gets displayed when hovering 2</td> 
    <td class='hover' style='display:none;'>this one gets displayed when hovering 3</td> 
    </tr> 
</table> 

对不起，如果我忘了什么事，但不得不重写这一切，因为它被嵌入PHP脚本。

最好的问候， 阿尔特

Answer 1

像这样的东西应该如果您没有使用hoverIntent也许上面会不会携手

var linkIsHovered = false; 

$(document).ready(function(){ 
    $(".popup").hoverIntent(hover, original) 
     .delegate("a", "mouseover", flagLinkHover) 
     .delegate("a", "mouseout", flagLinkUnHover); 

}); 

function flagLinkHover() { 
    linkIsHovered = true; 
} 

function flagLinkUnHover() { 
    linkIsHovered = false; 
} 

function hover(){ 
    if (linkIsHovered) {return} 
    $(this).addClass("hovering"); 
    $(".hovering .original").fadeOut(50, function() { 
     $(".hovering .hover").fadeIn(300); 
    }); 
} 

function original(){ 
    if (linkIsHovered) {return} 
    $(".hovering .hover").fadeOut(50, function() { 
     $(".hovering .original").fadeIn(300); 
     $(".popup").removeClass("hovering"); 
    }); 
} 

，你不得不unqueue和撤销部分完成动画，但与hoverIntent它可能会足以使用上述方法。