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/