どうやってanimateとaddclassを一緒に使うのですか？

Question

私のページの要素をアニメーション化しようとしています。私はクリック条件で一種のズームを探しています。 divをクリックするとそのdivがページになります。

アニメーターが機能するようになりました。ただし、addClass関数は機能しません。

私はまた、ユーザーがスクロールや自動化されている私の要素のスクロールを使用しています。だから、スクロールを制御するdivは私の実際の要素の上に薄れている。それを動かすために要素をクリックすると、それは機能します。それはより広いと高くなりますが、私は位置とZのインデックスを動作させることはできません。だから私はそれを動作させるためにaddClass関数を追加しようとしましたが動作しません！

ここに私のコード

$("#bloc1").live('click', function(){ 
    $("#bloc1").animate({ 
     width: "800px", 
     margin: "0px", 
     height: "100%", 
    },3000); 

    $('#bloc1').addClass('figureclick'); 
}); 

はあなたにもそれが

をご支援いただきありがとうござい効果を確認するために、「ル・ブロック1」に、ここtest pageクリックをOU試すことができます！

UPDATE !!

私はHTML5 CSS3を使用してのdivイムを使用していないと、彼らはただのフィギュア/フィギュアタグ があり、私のCSSは#containerの図のようになります{}

それはaddclassが動作するように防ぎますか？

Answer 1

構文の強調表示は全て伝えます - あなたはエスケープバックスラッシュを削除する必要があります。 .live()も一つの機能を取るだけなので、二人は同じ関数に組み合わせる：あなたは、ネストされた関数やエスケープのスラッシュを持っている理由

$("#bloc1").live('click', function(){ 
    $("#bloc1").animate({ 
     width: "800px", 
     margin: "0px", 
     height: "100%", 
    },3000); 

    $('#bloc1').addClass('figureclick'); 
}); 

Answer 2

わかりません。あなたがこれを行うことができるはず...

$("#bloc1").live('click', function() { 
    $(this).animate({ 
    width: "800px", 
    margin: "0px", 
    height: "100%" 
    },3000).addClass('figureclick') ; 
}); 

Answer 3

は、アニメーションのオプションの後にあなたの末尾にカンマに注意してください。 IEで問題が発生します。

また、あなたは以下のように、連鎖を利用することができます。

$("#bloc1").live('click', function(){ 
    $(this).animate({ 
     width: "800px", 
     margin: "0px", 
     height: "100%" 
    },3000).addClass('figureclick'); 
}); 

そして、あなたはアニメーションが完了した後にクラスを追加したい場合は、最後に、あなたは次のようにコールバック関数を使用することができます。me..whatが再び問題だため

$("#bloc1").live('click', function(){ 
    $(this).animate({width: "800px", margin: "0px", height: "100%"}, 3000, function() { 
     $(this).addClass('figureclick'); 
    }); 
});