2

アニメーション スライドショーの簡単なコードを次に示します。これは 2 つのことを想定しています: - 1 つ目は「mouseenter」イベントで - 「親指」画像をバウンスします - 2 つ目 - サムネイルの大きな画像を表示してバウンスします

$('img.thumb').mouseover(function (){
    $(this).effect('bounce', 500, function(){
        var src = 'images/screens/' + $(this).attr('id').substr(0,1) + '.jpg';
        $('.slideShow img').attr('src' ,src);
        $('.slideShow img').toggle('bounce').css('margin-top','2.5%');
        });
    });
$('img.thumb').mouseleave(function (){
        $('.slideShow img').fadeOut();
    });

問題は、Google Chrome では完璧に動作することですが、Firefox と IE ではおかしな動作をします。親指の画像が跳ね続け、大きな画像が表示されたり消えたりし続けます。

ここでのトリックは何ですか？

4

2 に答える 2

0

あなたの投稿から私が理解したことから、カスタム アニメーションで探しているのは Jquery ツールチップ ウィジェットだと思います: http://jqueryui.com/tooltip/#custom-animation

それはあなたが探しているものを満たしていますか？

于 2013-01-30T02:09:56.237 に答える
0 
$('img.thumb').mouseover(function (){
    $(this).effect('bounce', 500, function(){
        var src = 'images/screens/' + $(this).attr('id').substr(0,1) + '.jpg';
        $('.slideShow img').attr('src' ,src);
        $('.slideShow img').css('margin-top','2.5%');
        });
    });
$('img.thumb').mouseleave(function (){
        $('.slideShow img').fadeOut();
    });
于 2013-01-30T02:14:22.680 に答える