Buenas.
Hasta ahora nunca me había hecho falta postear, mis duda generalmente ya estaban resueltas aquí. Pero me enfrento ahora mismo a un problema cuya causa no se detectar.
Estoy utilizando este útil plugin:
http://www.appelsiini.net/projects/lazyload
El plugin me funciona bien en un contenedor, pero en cuando quiero aplicárselo a varios contenedores en una misma página ya no me funciona, solo me funciona uno, el primero.
Código:
Esta es la parte del script:
Código:
$('img.lazy').lazyload({
container: $('#slider1, #slider2'),
effect : "fadeIn"
});
Y este es el HTML:
Contenedor 1:
Código:
<div id="slider1">
<ul>
<li>
<img class="lazy" src="images/ffffff.gif" data-original="images/beLogoinicio.jpg" width="600" height="417" />
<div id="slider_savant">
<ul>
<li>
<img class="lazy" src="images/ffffff.gif" data-original="images/beLogoinicio.jpg" width="600" height="417" />
<div id="slider_savant">
<ul>
<li>
<img class="lazy" src="images/ffffff.gif" data-original="images/beLogoinicio.jpg" width="600" height="417" />
</div>
Contenedor 2:
Código:
<div id="slider1">
<ul>
<li>
<img class="lazy" src="images/ffffff.gif" data-original="images/beLogoinicio.jpg" width="600" height="417" />
<div id="slider_savant">
<ul>
<li>
<img class="lazy" src="images/ffffff.gif" data-original="images/beLogoinicio.jpg" width="600" height="417" />
<div id="slider_savant">
<ul>
<li>
<img class="lazy" src="images/ffffff.gif" data-original="images/beLogoinicio.jpg" width="600" height="417" />
</div>
////
Ambos contenedores están en la misma página, uno encima de otro, en teoría si en el script especificas a qué contenedores quieres que afecte el lazy load se aplicaría, sin embargo solo se me aplica al primero.
He probado bastantes cosas, como dar otro nombre a la clase: class="lazy" (para contenedor 1) y class="lazy2" (para el contenedor 2).
Pero no consigo hacerlo funcionar.
¿Alguien le ha ocurrido algo semejante o puede ayudarme? Muchas gracias.