[Javascript] fadeinとappendを使う


Answers

あなたが持っている問題を完全に理解しているかどうかはわかりませんが、このようなものはうまくいくはずです:

HTML:

<div id="posts">
  <span id="post1">Something here</span>
</div>

Javascript:

var counter=0;

$.get("http://www.something/dir",
    function(data){
        $('#posts').append('<span style="display:none" id="post' + counter + ">" + data + "</span>" ) ;
        $('#post' + counter).fadeIn();
        counter += 1;
    });

基本的には、各スパンの内容(各 "投稿")を1つのスパンにラップし、そのスパンの表示をnoneに設定して表示しないでフェードインします。

Question

JSONデータをページに読み込んで、appendTo()を使用していますが、私の結果、アイディアはどれも消え去ろうとしていますか?

$("#posts").fadeIn();
$(content).appendTo("#posts");

ドキュメントにappendとappendToの違いがあることがわかりました。

私もこれを試した:

$("#posts").append(content).fadeIn();

私はそれを得た、上記のトリックでした!

しかし、私はJSON値の1つとして「未定義」を取得します。




定義されたCSSで次のことを前提としています。

.new {display:none} 

javascriptは次のようにする必要があります。

$('#content').append('<p class='new'>Hello!</p>');
$('#content').children('.new').fadeIn();
$('#content').children.removeClass('new');
$('#content').children('.new').hide();



私のために、これはexprensiveを持っています:

$("dt").append(tvlst.ddhtml);
$("dd:last").fadeIn(700);



コードは線形に実行されないことに注意する必要があります。 アニメーション化されたものは、アニメーションを実行して戻ってくるコードの実行を停止することは期待できません。


   commmand(); 
   animation(); 
   command();  

これは、アニメーションがタイムアウトなどの魔法を使用してジョブを実行し、settimeoutがノンブロッキングであるためです。

このため、アニメーションが完了したときに実行するアニメーションのコールバックメソッドがある(まだ存在しないものを変更しないようにする)

   command(); 
   animation( ... function(){ 
      command(); 
   });