Ajax 성공, fadeIn()을 사용한 HTML 추가

Question

ajax 성공 함수에서 <ul>에 html을 추가하려고합니다.

HTML

<ul id="revisionList"> 
    <!-- ajax.js will insert ordered list here based on number of revisions --> 
</ul> 

아약스 성공 나는 목록이 구축 된 후 전체 <ul> 페이딩 가야합니까 어떻게

success: function(json) 
     { 
      /* 
      If successful build the list of revision links 
      Links include link that will load images in next tab 
      */ 

      //loop through revisions and display 
      for(i = 0, j = json.revision_count.length; i < j; i++) { 
       //count for revision number 
       var k = i + 1; 
       //revision number, does not match k 
       var revisionID = json.revision_count[i].layout; 
       $('#revisionList').append(
        "<li><a onclick=\"initEditRevision(" + galleryID + ',' + revisionID + ")\" href=\"#editRev\" data-toggle=\"tab\">Revision " + k + "</a></li>" 
       ); 
      } 

     } 

?

Answer 1

이

success: function(json) { 
    var $list = $('#revisionList'); 
     $list.hide(); // Hide Here 
    for (i = 0, j = json.revision_count.length; i < j; i++) { 
     var k = i + 1; 
     var revisionID = json.revision_count[i].layout; 
     $list 
      .append("<li><a onclick=\"initEditRevision(" + galleryID + ',' + 
        revisionID + ")\" href=\"#editRev\" 
        data-toggle=\"tab\">Revision " + k + "</a></li>"); 
    } 
    $list.fadeIn('slow'); // Fade In here 
}​ 

Answer 2

for (... 

} 
$("#revisionList").hide().fadeIn(); 

아니면 당신이 for 루프 전에 숨길 수보십시오; 뭐가 가장 효과가 있든간에.

Answer 3

CSS display 속성을 먼저 사용하거나 CSS를 사용하지 않으려면 style 속성을 사용하여 숨길 수 있습니다.

#revisionList{display: none;} 

또는

<ul id="revisionList" style="display: none;"> 

는 완전히 appnded 모든 li의 후 페이드.

$("#revisionList").fadeIn(500);