jquery div隱藏時它不應該

我有一個圖像，當我把鼠標懸停在它上面的選項出現在它下面。當我轉向他們隱藏的選項時。我已經設置了效果基本show不會發生，直到用戶從父DIVjquery div隱藏時它不應該

$('.file-options').hide(); 
$('.file a img').mouseover(function(){ 
    $(this).closest('.file').find('.file-options').slideDown(); 
}); 
$('.file a img').closest('.file').mouseout(function(){ 
    $(this).find('.file-options').slideUp(); 
}); 

<div class="document"> 
    <div class="file"> 
    <a href="#"><img src="http://www.dermalog.com/images/pdf-icon.png" alt=""></a> 
    <div class="file-options showhouse-text"> 
     <a href="#" onclick="return confirm('Are you sure you want to delete this file?');" class="show-tooltip" data-html="true" data-placement="top" data-original-title="Delete File">D</a> 
     <a href="#" class="show-tooltip" data-html="true" data-placement="top" data-original-title="Edit File">E</a> 
    </div> 
    </div> 
</div>

這裏移開是的jsfiddle http://jsfiddle.net/5vAFh/2/

來源

2013-10-09 Pierce McGeough

從<img>的mouseout事件冒泡到.file元素，因此觸發您的代碼隱藏<div>。使用mouseleave事件（不給事件冒泡反應），而不是：

$('.file a img').closest('.file').mouseleave(function(){ 
    $(this).find('.file-options').slideUp(); 
});

Demo

來源

2013-10-09 09:46:08

'$鼠標離開（）'足夠ISN'它呢？ – mikakun

爲什麼不是'$（'。file：has（a img'））。mouseleave' –

mouseout是如何做錯的，mouseleave是對的？ –

或你可以這樣做：演示http://jsfiddle.net/USBRy/

支票if(!$(this).is(':hover')) {

希望這會有所幫助:)

代碼

$('.file-options').hide(); 

$('.file a img').mouseover(function() { 
    $(this).closest('.file').find('.file-options').slideDown(); 
}); 

$('.file a img').closest('.file').mouseout(function (e) { 
    if(!$(this).is(':hover')) { 
     $(this).find('.file-options').slideUp(); 
    } 
});

來源

2013-10-09 09:50:31

你幾乎有..試試這個：（」文件 '）。

$('.file-options').hide(); 

$('.file').mouseover(function(){ 
    $(this).find('.file-options').slideDown(); 
}); 

$('.file').mouseout(function(e){ 
    if($(e.toElement).parents('.file').length < 1) { 
     $(this).find('.file-options').slideUp(); 
    }; 
});

http://jsfiddle.net/5vAFh/12/

來源

2013-10-09 09:51:32 Jake

jquery div隱藏時它不應該

回答

相關問題