2013-05-30 33 views
0

我在我的頁面上有一個div,編號爲area如何在懸停時繼續顯示關閉圖標?

當用戶的鼠標進入此DIV時,我想在右下角顯示一個關閉圖標(它位於div內)。一切工作正常,但問題是當用戶懸停在關閉圖標#closeicon區域時,它會隱藏圖標。

因此,請建議我如何在用戶懸停時繼續顯示關閉圖標。

這裏是我的代碼:

$("#area").on('mouseenter',function(e){ 
      e.stopPropagation(); 
      showCloseIcon(); 

    }).on('mouseleave',function(e){ 
     e.stopPropagation(); 
     var except=$("#closeicon"); 
     if(!except.is(e.target) && except.has(e.target).length===0){ 
      hideCloseIcon();  
     } 
    }); 

編輯

closeicon沒有進入區域DIV的孩子。由於某種原因,我使用css(絕對位置)將其定位在區域div上。

+1

如果它在div裏面,爲什麼不使用css? –

+0

@ Karl-AndréGagnon我剛剛對我的問題進行了編輯「closeicon不是區域DIV的孩子,我使用css(絕對位置)將它放在區域div上。」 – Peeyush

回答

1

您可以使用此代碼:

$('#area, #closeicon').hover(function(){ 
    $('#closeicon').show(); 
}, function(){ 
    $('#closeicon').hide() 
}) 

剛上這兩個ID的綁定事件。

此外,我使用了.hover,因爲它更短,並且執行與.mouseenter().mouseleave()相同的操作。在同一個電話。

小提琴:http://jsfiddle.net/S9LQY/

0

$(「#區」)>> $(「#區,#closeicon」)

+0

closeicon不是該地區DIV的孩子。我使用CSS(絕對位置)將其定位在區域div上。 – Peeyush

+0

這就是逗號的 – celwell

0

我不知道如果這是你正在尋找的東西,但你可以使用CSS這:

#closeicon { 
    display: none; 
} 

#area:hover > #closeicon { 
    display: block; 
} 
+0

closeicon不是區域DIV的孩子。我使用CSS(絕對位置)將其定位在區域div上。 – Peeyush

相關問題