JS當鼠標離開內容區域時隱藏html內容

Question

我有一個單擊按鈕後會出現的元素。我現在想要的是當我的鼠標指針離開元素時隱藏元素。這怎麼可能？由於

JS腳本：

  $(document).ready(function() { 

      $('.hide').hide(); 



      $('.button').click(function() { 
      $(this).closest('div').find('.hide').toggle(400); 
      return false;   
      }); 

HTML代碼：

<a class="button" >More</a> 

<div class="hide" ><img src="images/icon.png" /></div> 
//I want this div hide element to hide after my mouse pointer leave this div area 

非常感謝你：d

Answer 1

$("div.hide").mouseleave(function(){ 
    $(".hide").hide(); 
}); 

對於再次展示了你可以使用的mouseenter（）之類的DIV內容：

$("div.hide").mouseenter(function(){ 
    $(".hide").show(); 
}); 

，或者您也可以這樣做：（對於切換使用）

$("div.hide").mouseleave(function(){ 
    $(".hide").hide(); 
}).mouseenter(function(){ 
    $(".hide").show(); 
}); 

Answer 2

你嘗試使用mouseout事件？

http://api.jquery.com/mouseout/