Jquery播放/暂停切换与翻转

Question

我有一个用于幻灯片播放/暂停按钮的jQuery脚本，可在单击时在两个图像之间切换。有没有办法将翻转状态添加到正在切换的单独图像中？

这是脚本：

$(".play").toggle(
function () {
$(this).find("img").attr({src:"images/btn-play.png"});
},
function () {
$(this).find("img").attr({src:"images/btn-pause.png"}); 
}
);

这是网站：http://www.beta.erickdoxey.com（正在进行中）。前一个和下一个按钮具有我希望通过暂停/播放按钮实现的翻转状态。任何帮助将不胜感激。

Answer 1

我的建议是在播放按钮中添加一个类，然后在悬停时检测该类。我的意思是：

$(".play").toggle(function () {
    $(this).find("img").attr({src:"images/btn-play.png"}).addClass('paused');
}, function () {
    $(this).find("img").attr({src:"images/btn-pause.png"}).removeClass('paused'); 
});

然后你就可以在悬停时检测它：

 if (this).hasClass('paused') {
    $(this).find("img").attr({src:"images/btn-play-hover.png"})
 } else {
    $(this).find("img").attr({src:"images/btn-pause-hover.png"})
 }

您也可以在以后进一步使用该课程。