e fiz um Load More, parecido com o do twitter, que carrega um JSON, e nele, eu mando fazer um slice, para exibir a quantidade que eu quero de dados.
Só que o problema é que, como eu mando exibir inicialmente, junto com o DOM 12 registros, esses 12 registros, funcionam com o JS que rodou no DOM, mas se eu clicar em Load More, ele não funciona...
Não sei o que pode ser isso.
código que roda junto ao DOM:
$(".vimeo .title-thumb").animate({ opacity: 0.85 }, 1 ).css( "display", "none" ); //Set Opacity $(".vimeo").each(function(e) { $(this).mouseover(function(){ var title = $(this).find(".title-thumb"); var span = $(title).find("span"); $(span).animate({ height: "50px" }, 10); $(title).css( {display: "block", marginTop: "-52px"} ); }); $(this).mouseout(function(){ var title = $(this).find(".title-thumb"); var span = $(title).find("span"); $(title).css( { height: "0px", marginTop: "-12px", display: "none" } ); }); });
Código do Load More:
var page = 0; var pagesize = 12; var arr = <?php echo $_thumbVideosJson ?>; function getPage( page ) { this.page = page; var start = this.page * pagesize; var end = Math.min(start + pagesize, arr.length - 1); return arr.slice(start, end); } HTML( getPage( page ) ); function HTML( jsonTypes ) { $.each( jsonTypes, function( i, video ) { $("<li></li>").html( "<a href='#" + video.url + "' title='" + video.title + "' class='vimeo'><img src='" + video.thumbnail_medium + "' alt='thumb'><div class='title-thumb'><span><b><strong>" + video.title + "</strong><br />by <strong>" + video.user_name + "</strong></b></span></div></a>" ).appendTo($('.thumbs_channels')); }); } $("#load-more").click( function(){ page += 1; HTML( getPage( page ) ); });
$_thumbVideosJson seria a variavel que recebe os dados do JSON.
Obrigado pela ajuda.