Помогите использовать событие JQuery .click для замены атрибутов onmousehover и onmouseout

Question

Я новичок в использовании Javascript и JQuery и могу использовать небольшую помощь.

Я пытаюсь создать панель управления для приостановки и воспроизведения слайд-шоу JQuery Cycle.На панели есть ссылки назад, вперед и воспроизведения.Когда пользователь наводит курсор на элемент управления, он заменяет изображение другим.Когда пользователь нажимает на ссылку «Воспроизвести», он заменяет изображение на изображение паузы.Я хотел бы иметь возможность заменить атрибуты onmousehover и onmouseout, а также определить отдельное изображение при наведении курсора на ссылку паузы.Возможно ли это?

Это мой код:

$('.pause').click(function(){
  $("#pausectrl").attr('src',"images/pause1.png");
  $("#pausectrl").attr('onmouseover',"this.src='images/pause2.png'");
  $("#pausectrl").attr('onmouseout',"this.src='images/pause1.png'");
  return false;
});  

И HTML:

<a href="" id="play" class="pause"><div id="playctrl"><img id="pausectrl" src="images/play1.png" onmouseover="this.src='images/play2.png'" onmouseout="this.src='images/play1.png'"></div></a>  

Answer 1

читать этот урок

http://bavotasan.com/tutorials/a-simple-mouseover-hover-effect-with-jquery/

Аналогичный вопрос

Изменение источника изображения при наведении курсора с помощью jQuery

необработанный код

HTML

<img src="first.gif" data-hover="second.gif" class="rollover" >

JQuery

$(function() {
    $('.rollover').hover(function() {
        var currentImg = $(this).attr('src');
        $(this).attr('src', $(this).attr('hover'));
        $(this).attr('hover', currentImg);
    }, function() {
        var currentImg = $(this).attr('src');
        $(this).attr('src', $(this).attr('hover'));
        $(this).attr('hover', currentImg);
    });

Ссылка

Answer 2

попробуйте это:

$("#pausectrl").mouseenter(function(){
  $(this).attr('src','images/pause2.png');
}).mouseout(function(){
 $(this).attr('src','mages/pause1.png');
});