Событие jQuery mouseover на 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'/>"); 
}); 

Я хочу, чтобы добавить событие к элементу изображения, а не дел. Я читал что-то вроде $(:last:image), чтобы выбрать последнее изображение (так как это последнее изображение, я думал, это сработает).

Любая помощь будет замечательной?

Или, если вы можете указать мне на достойный учебник, я узнаю сам?

Answer 1

Вы можете сделать это очень просто с помощью функции hover, которая имеет два аргумента: функцию для mouseenter и одну для mouseleave. Вы также можете выбрать элемент img в пределах #enter с помощью селектора потомок.

Наконец, вы можете прямо установить свойство src элемента img.

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