jQuery mouseoverイベントon image.Advice？

Question

jQueryを初めて使用しました。 イメージを変更するイメージにmouseoverイベントを追加しようとしています。イメージを元のイメージに戻すmouseoutイベントを追加しようとしています。

私は画像

<div id="enter"> 
    <img src="images/entersite.png"/> 
</div> 

といくつかのjQueryコード

$("#enter").mouseover(function(){ 
    $("#enter").html("<img src='images/entersitehover.png'/>"); 
}); 
$("#enter").mouseout(function(){ 
    $("#enter").html("<img src='images/entersite.png'/>"); 
}); 

を持っている私は、画像要素ではなく、div要素にイベントを追加したいです。 私は最後のイメージを選択するために$(:last:image)のようなものを読んでいました（これがうまくいくと思った最後のイメージです）。

助けてもらえますか？

まともなチュートリアルを教えていただけたら、私は自分自身を学ぶでしょうか？

Answer 1

hover関数で非常に簡単に行うことができます。関数には、mouseenterの関数とmouseleaveの関数の2つの引数があります。下位セレクタを使用して#enter内のimg要素を選択することもできます。

最後に、img要素のsrcプロパティを直接設定できます。

$('#enter img').hover(function(){ 
    this.src = "images/entersitehover.png"; 
}, function(){ 
    this.src = "images/entersite.png"; 
});