1

私はslideUpとSlideDownのメニューを持っています。

ユーザーが menuArea をクリックすると、メニューが開き、十字の付いた画像が表示されます。ボタンを閉じるには、ユーザーが画像をクリックすると、その画像が非表示になります。

このステップで問題が発生しました。

このフィドルを見てください：http://jsfiddle.net/pedroR/7YNJY/3/

注: 画像のため、Chrome または IE でこのフィドルを参照してください。

ありがとう

4

3 に答える 3

2

http://jsfiddle.net/7YNJY/12/ここでこれを試してみてください。アニメーションを元に戻すことはできますが、読みやすくするために少しだけダムに入れました。

于 2011-08-02T09:05:31.037 に答える
2

問題は、が要素img内に含まれていることです。#menuTextつまり、img要素をクリックすると、のクリックイベントハンドラー#menuTextも起動され、それが実行されると、フェードインimgします。

imgクリックイベントハンドラーに引数を追加し、呼び出しstopPropagationてイベントがバブリングしないようにすることで、これを防ぐことができます。

$('#menuArea #menuText img').click(function(e) {
    e.stopPropagation();
    $('#menuArea ul').delay(100).slideUp(250);
    $(this).stop(true, true).delay(100).animate({
        opacity: 0
    }, '100', 'linear');
});

これが実際の例です。

于 2011-08-02T09:05:45.643 に答える
0

これがあなたが探している結果であるかどうかを確認してください：http：//jsfiddle.net/rkw79/7YNJY/13/

于 2011-08-02T09:07:19.510 に答える