jQuery: Insertion des éléments li un par un?

Question

J'ai écrit ce qui suit (partie d'un plugin jQuery) pour insérer un ensemble d'éléments d'un objet JSON dans un élément <ul>.

... 
query: function() { 
    ... 
$.ajax({ 
    url: fetchURL, 
    type: 'GET', 
    dataType: 'jsonp', 
    timeout: 5000, 
    error: function() { self.html("Network Error"); }, 
    success: function(json) { 
    //Process JSON 
    $.each(json.results, function(i, item) { 
        $("<li></li>") 
        .html(mHTML) 
        .attr('id', "div_li"+i) 
        .attr('class', "divliclass") 
        .prependTo("#" + "div_ul"); 

       $(slotname + "div_li" + i).hide(); 
       $(slotname + "div_li" + i).show("slow") 
      } 
    } 
    }); 
} 
    }); 
}, 
... 

Faire cela peut-être ajouter les <li> éléments un par un en théorie, mais quand je charge la page, tout apparaît instantanément. Au lieu de cela, y a-t-il un moyen efficace de les faire apparaître un à un plus lentement? Je vais vous expliquer avec un petit exemple: Si j'ai 3 items, ce code fait apparaître tous les 3 objets instantanément (au moins à mes yeux). Je veux quelque chose comme 1 fondu, puis 2 fondus, puis 3 (quelque chose comme un newsticker peut-être). Quelqu'un a une suggestion?

Answer 1

Vous pouvez obtenir l'effet recherché par le codage comme suit:

$(slotname + "div_li" + i).hide().delay(i*n).show("slow"); 

où n est une modification douce de retard (en millisecondes); Je suppose i aussi ici est l'index, et donc un nombre.