Estou fazendo um arquivo para carregamento de novas notícias, no entanto, as novas notícias aparecem rapidamente sem uma entrada suave.
Sei que dá para utilizar algo deste tipo:
$(“.containerNews”).append(result).children(':last').hide().fadeIn();
No entanto este código pega apenas a última linha do resultado Ajax, e eu gostaria de fazer o efeito com fadeIn
sempre nas últimas incrementações do Ajax.
Meu código está da seguinte forma:
$(".SeeMoreGame").click(function(){
$.ajax({
url:"seeMoreGames.php",
type:"POST",
data:{ searchValue: searchValue, numberRows: numberRows },
success:function(result){
$(".containerNews").append(result);
}
});
});
Eu consegui achar uma solução para este problema com ajuda de um comentário que esta logo abaixo . Caso alguém entre aqui porque está com o mesmo problema, basta adicionar uma class nos novos resultados que serão exibido, Exemplo:
<li class="hide"></li>
E antes do novo requerimento Ajax você remove esta classe. Exemplo:
$(".SeeMoreGame").click(function(){
$(".containerNews li").removeClass("hide");
$.ajax({
url:"seeMoreGames.php",
type:"POST",
data:{ searchValue: searchValue, numberRows: numberRows },
success:function(result){
$(".containerNews").append(result);
$(".hide").hide().fadeIn();
}
});
});
<div class="hide">...</div>
. E então basta utilizar$('.hide').fadeIn('slow')