0

画像またはテキストになるボタンのクリックイベントで、古いセットを置き換えて新しい画像セットをフェードインするスクリプトを実装しようとしています。私が何を複製しようとしているのか (残念ながらフラッシュで) を理解するには、http://seanjustice.com/の「教育」セクションを参照してください。

このjfiddle は、stackoverflow の別のトピックから見つけましたが、単純なフェード オン ホバー エフェクトを使用する代わりに、ボタンとマウス クリックを使用して一連の画像を置き換える方法がわかりませんでした。

誰でも提案を手伝ってもらえますか？画像の入れ替えをトリガーするボタンを使用するにはどうすればよいですか?

4

1 に答える 1

0

提供した jsfiddle を使用すると、次のようなことができます。

http://jsfiddle.net/H8z2G/41/

$('.fadein').each(function() {

    var std = $(this).attr("src");
    var hover = std.replace("text=1", "text=2");
    $(this).wrap('<div />').clone().insertAfter(this).attr('src', hover).removeClass('fadein').siblings().css({
        position:'absolute'
    });

    $('#swapper').click(function() {
        $('.fadein').stop().fadeTo(600, 0);
    });
});​

申し訳ありませんが、ここにマークアップがあります：

<img class="fadein" src="http://dummyimage.com/180x100/000/fff&text=1" alt="" />
<img class="fadein" src="http://dummyimage.com/180x100/cf5/fff&text=1" alt="" />
<img class="fadein" src="http://dummyimage.com/180x100/f0f/fff&text=1" alt="" />

<a href="#" id="swapper">Click Here</a>
于 2012-08-05T03:26:23.107 に答える