當懸停圖片

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/