1

クリックすると2つの画像を切り替えるスライドショーの再生/一時停止ボタン用の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 (作業中)。前のボタンと次のボタンには、一時停止/再生ボタンで実現したいロールオーバー状態があります。どんな助けでも大歓迎です。

4

1 に答える 1

0

私の提案は、再生ボタンにクラスを追加し、ホバーでそのクラスを検出することです。私が意味するのは：

$(".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"})
 }

そのクラスを後で他のことにさらに使用することもできます。

于 2012-11-01T05:47:44.310 に答える