只有在沒有懸停在某個元素上時執行懸停（）

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它可能會足以使用上述方法。