[AJAX] Scroll infini de masonry
Salut à tous, je vous explique mon problème.
J'ai installé le scroll infinite de masonry sur ma gallerie d'image.
Le chargement des images suivante ce fait sans soucis mais lorsque je veux lancer une popup (javascript) des images scrollé j'ai aucune réponse.
C'est comme si le script ne se charge pas.
Voilà le code :
Code:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63
| <body id="base" class="use-hover">
<nav id="site-nav">
..... <!-- menu -->
</nav>
...
<div id="content" class="transitions-enabled infinite-scroll clearfix">
.... <!-- div(s) de la gallerie images -->
</div>
<nav id="page-nav">
<a href="2.htm"></a> //page identique à la premiere à part pour les images
</nav>
<div id="popup_poste" class="popup_block">
<p>LingLing pour halloween</p>
<div class="blocFils1">
<a href="#?w=25" rel="popup_image" class="poplight">
<img src="3.jpg" border="0" alt="Description Image">
</a>
</div>
<div class="blocFils2">social</div>
</div>
<div id="popup_image" class="popup_block">
<p>Titre</p>
<img src="3.jpg" border="0" alt="Description Image">
</div>
<script>
$(function(){
var $container = $('#content');
$container.imagesLoaded(function(){
$container.masonry({
itemSelector: '#globalcadre',columnWidth: 0
});
});
$container.infinitescroll({
navSelector : '#page-nav', // selector for the paged navigation
nextSelector : '#page-nav a', // selector for the NEXT link (to page 2)
itemSelector : '#globalcadre', // selector for all items you'll retrieve
loading: {
finishedMsg: 'No more pages to load.',
img: 'http://i.imgur.com/6RMhx.gif'
}
},
// trigger Masonry as a callback
function( newElements ) {
// hide new items while they are loading
var $newElems = $( newElements ).css({ opacity: 0 });
// ensure that images load before adding to masonry layout
$newElems.imagesLoaded(function(){
// show elems now they're ready
$newElems.animate({ opacity: 1 });
$container.masonry( 'appended', $newElems, true );
});
}
);
});
</script> |
Merci d'avance pour vos réponses !