0

我是使用 Javascript 和 JQuery 的新手,可以使用一些帮助。

我正在尝试创建一个用于暂停和播放 JQuery Cycle 幻灯片的控制面板。该面板具有 prev、next 和 play 链接。当用户将鼠标悬停在控件上时,它会将图像替换为另一个。当用户点击播放链接时,它会用暂停图像替换图像。我希望能够替换 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>  
4

2 回答 2

0

尝试这个:

$("#pausectrl").mouseenter(function(){
  $(this).attr('src','images/pause2.png');
}).mouseout(function(){
 $(this).attr('src','mages/pause1.png');
});
于 2011-05-12T13:05:30.617 回答
0

阅读本教程

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);
    });

参考

于 2011-05-12T13:05:52.617 回答