如果光標位於打開的元素內，則保持元素處於打開狀態

Question

我試圖在光標移動到元素時保持切換的元素可見。

我的代碼是現在：

<div class="infobox"> 
    <i class="icon-info-sign"></i> 
    <div class="infobox_content" style="display: none;"> 
     Content 
    </div> 
</div> 

有了這個JavaScript/jQuery的

$("div.infobox i.icon-info-sign").hover(
    function() { 
     $(this).parent().find(".infobox_content").stop(true).show("slow"); 
    }, 
    function (e) { 
     $(this).parent().find(".infobox_content").stop(true).hide("slow"); 
    } 
); 

我如何檢測出光標已移動到.infobox_content？如果是這樣，我需要讓元素保持打開狀態，並且只能在.infobox_content之外再次隱藏元素。

Answer 1

將懸停更改爲infobox而不是其中的圖標應該簡化UI。

$("div.infobox").hover(
    function() { 
     $(this).find(".infobox_content").stop(true).show("slow"); 
    }, 
    function (e) { 
     $(this).find(".infobox_content").stop(true).hide("slow"); 
    } 
); 

如果你有infobox內更多的元素比顯示，這是不會因爲這些其它元素的工作，包在內部的div的圖標和內容，所以他們都有一個共同的父，並綁定懸停那個共同的家長