0

正方形の div (「.block」) のセットがクリックされるとフェードアウトし、フェードアウトするとすぐにフェードインする大きな div (「#container」) に置き換えられるようにしようとしています。これはうまくいきます：

$('.block').animate({opacity:0},400,'swing',function(){ $('#container').fadeIn();});

ここで「アニメート」を使用するのは、ブロックがフェードアウトしたときにブロックが占めていたスペースを崩壊させたくないからです (fadeOut を使用した場合に起こります)。

'#container' div には閉じるボタンがあり、クリックするとコンテナーがフェードアウトし、ブロックが再びフェードインします。ここに問題があります: 閉じるボタンをクリックすると、コンテナは正常にフェードアウトしますが、コンテナが最初に閉じるのを待っていないかのように、新しいブロックが非常に突然表示されます。コード：

$('#container').fadeOut(400,function(){ $('.block').animate({opacity:100},400,'swing');});

この質問は、遅延を追加することを提案しています-私にとってこれは、コンテナをフェードアウトさせてから、少し待ってから、ブロックをすばやく（速すぎて）元に戻すことだけです。

これがうまくいかない理由を教えてください。

4

1 に答える 1

0

CSS 不透明度は 0 から 1 までの値を受け入れます。

$('#container').click(function () {
    $(this).fadeOut(400, function () {
        $('.block').animate({
            opacity: 1 //was 100
        }, 400, 'swing');
    });
});

http://jsfiddle.net/WEhCc/1/

于 2013-03-01T13:55:47.250 に答える