Foros del Web » Programando para Internet » Jquery »

problemas con masonry e infinite-scroll

Estas en el tema de problemas con masonry e infinite-scroll en el foro de Jquery en Foros del Web. hola ando trabajandouna web, y empece a usar un recurso jquery llamado "masonry", todo bien hasta ahi, pero luego decidi implementar en la pagina lo ...
  #1 (permalink)  
Antiguo 18/03/2014, 16:47
vis97c
Invitado
 
Mensajes: n/a
Puntos:
Pregunta problemas con masonry e infinite-scroll

hola ando trabajandouna web, y empece a usar un recurso jquery llamado "masonry", todo bien hasta ahi, pero luego decidi implementar en la pagina lo del scroll infinito, asi como facebook, pinterest, twitter y alguna otra similar.

estuve investigando diversos codigos con los cuales mantener el masonry, y al final di con este:

Código PHP:
  $(function(){
  
// selecciono el contenedor
    
var $container = $("#cont");
  
// esto oculta los items mientras cargan las imagenes
    
var $it = $(".msry");
    var 
$items $it.css({ opacity});
// inicio masonry al cargar las imagenes
    
$container.imagesLoaded(function(){
     
$items.animate({ opacity});
     
$container.masonry({
      
itemSelector".msry"
     
});
    });
    
$container.infinitescroll({
     
navSelector  "#cont .nav",    // esto mediante la paginacion trae los items dela siguiente pagina
     
nextSelector "#nav .next",  
     
itemSelector "#cont .ipost",    
     
loading: {
      
finishedMsg"No more pages to load.",
      
img"http://i.imgur.com/6RMhx.gif"
     
}
    },
    
// anexo los nuevos items a masonry
    
function( newElements ) {
     
// oculto los items mientras cargan las imagenes
     
var $newElems = $( newElements ).css({ opacity});   // al cargar las imagenes se muestran los nuevos items y asi sucesivamente
     
$newElems.imagesLoaded(function(){
      
$newElems.animate({ opacity});
      
$container.masonry("appended"$newElemstrue);
     });
    });
   }); 
el codigo anterior es una asociasion entre dos librerias java script (masonry.min.js e infinite-scroll.min.js).

en teoria deberia funcionar al completo, pero solo funciona la primera parte, es decir el masonry.

la pagina muestra inicialmente 10 items y el enlace que tengo en la paginacion es una varible php enviada por get, asi:

?mas=2

al recibirla la multiplico por 10 y le resto 10 y mediante limit 10,10 pro ejemplo hago que me muestre los siguientes 10 items para que el codigo los capture.

he intentado de to y no hago que funcione bien, podrian ayudarme?

Etiquetas: infinite, infinito, javascript, recurso, scroll
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 16:58.