a função que eu tenho e para me mostrar mais artigos toda vez que chego ao final da pagina ( paginação scroll infinito ) funciona perfeitamente mas tenho uma duvida que nao estou conseguindo resolver, quero carregar mais artigos assim que o scroll chegar da div "footer" ou na div "final" que vem antes do footer em vez de carregar sempre ao final da pagina
$(document).ready(function() {
var win = $(window);
// Each time the user scrolls
win.scroll(function() {
// End of the document reached?
if ($(document).height() - win.height() == win.scrollTop()) {
$('#loading').show();
// Se jรก temos uma div com a classe "fim", nem chama o ajax de novo
if ( $('.fim').length > 0 ) {
$('#loading').hide();
return false;
}
var id = $(".tm:last").attr("id");
var cat = $(".tm").attr("cat");
$.ajax({
url: 'content/layout/art/load2.php?id='+id+'&cat='+cat,
dataType: 'html',
success: function(html) {
if(html){
$('#posts').append(html);
$('#loading').hide();
}else{
$('#posts').append("<div class='fim'><h1 style='color:red'>End of countries !!!!!!!</h1></div>");
}
}
});
}
});
});
a função funciona perfeitmente se eu nao colocar nada no final do codigo , assim a pessoa chega ao fim da tela , a msg e exibida que nao existe mais nada para ser carregado, mas como expliquei acima , preciso que que sempre que chegar a uma determinada div, a função rode e carregue mais anuncios ou eu crio uma div global onde os anuncios sao carregados dentro dela e quando chegar ao final dessa div ai sim carregue o codigo inserindo mais anuncios detro dela