Comment pouvons-nous ajouter une liste d'éléments un par un avec effet de fondu à l'intérieur méthode .each jQuery $

Question

-je avoir une réponse JSON passer à travers jQuery Ajax ($.ajax) sur .done() rappel Je manipulais réponse à une sortie html

.done(function(response) { 
    $.each(response, function(i, video) { 
     html = '<div class="col-lg-6">'+response.img+'</div>"; 
     $(html).appendTo('#myImages'); 
    })  
}) 

Ainsi, le code ci-dessus fonctionne parfaitement, mais la chose que je veux acheive est, je veux apparaître chaque divs avec l'image [ajouter var = html à #myImages] un par un avec un léger effet fadeIn, donc Comment puis-je ajouter ceci. Je vérifiais avec setTimeout fonction, mais cela ne fonctionne pas comme je le veux.

Answer 1

Pour le rendre fondu en vous pouvez essayer ce qui suit:

$(html).hide().appendTo('#myImages').fadeIn(1000); 

Ensuite, si vous voulez construire une séquence, il y a des façons de le faire, voici plus simple async/Attendent essayer:

async function render(item, delay) { 
    html = '<div class="col-lg-6">' + item.img + '</div>"; 
    $(html).hide().appendTo('#myImages').fadeIn(delay); 

    return new Promise(function(resolve){ 
    setTimeout(function() { 
     resolve(); 
    }, delay); 
    }) 
} 

.done(function(response) { 
    for(var i = 0; i < response.lenght; i++) { 
    try { 
     await render(response[i], 1000); 
    } 
    catch(err) { 
     console.log(err); 
    } 
    } 
})