当悬停图片

Question

Soory，如果我不告诉你所有的代码，因为我不知道如何实现它显示编辑框，我试图做的是，假设这是继图片：

#photo{ width:100px;height:120px;} 
    <div id="photo"><img src="myphoto.jpg"/></div> 

，我有编辑照片框：

#edit{width:60px;height:30px;background:#000000;color:#ffffff} 
    <div id="edit">edit it</div> 

当我徘徊的形象，我想在图像的右上角的编辑辐透框显示，当光标移动出来的图像，它将会消失。

所以我想用下面

 $("#photo img").hover(function() { 
    $("#edit").fadein(); 
}, function() { 
    $("#edit").hide(); 
    }); 

任何一个可以帮我一下吧，非常感谢！

Answer 1

基本上就是这样。您还需要（a）在样式表中使用display:none加载隐藏#edit元素，（b）将fadein更改为fadeIn（大写I），并且可能（c）将#edit元素绝对置于#photo div内，当页面出现并消失时不会重新排版页面。

更新：噢，和（d）添加一个鼠标悬停到#edit元件，使得在其上移动鼠标不注册为图像的鼠标移出：

$("#edit").mouseover(function() { 
    $(this).show(); 
}); 

http://jsfiddle.net/mblase75/bNmAd/2/