bonjour, j’essaie de combiner le chargement automatique d’une galerie de .gif animés avec Infinite Ajax Scroll et ce plugin jquery qui permet de remplacer le .gif animé par une image statique en guise de preview (l’utilisateur doit alors cliquer sur l’image pour lancer l’animation). Seulement, le gifplayer ne fonctionne qu’avec les deux premières images de ma galerie (car j’ai limité le nombre d’affichage à 2 dans config.php), au delà, les .png s’affichent mais les images ne sont plus cliquables…la classe «gifs*» n’est apparemment plus reconnue, auriez-vous une solution pour ce problème ? merci
les div image et navigation :
le javascript du scrolling infini
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21 <div class="galerie"> <!-- loop row data --> <?php while ($row = mysql_fetch_array($query)): ?> <div class="vignette"> <div class="inner"> <img id="<?php echo $row ['id']; ?>" src="galeries/585x390/gifs/<?php echo $row["id"]; ?>.png" class="gifs"/> </div> </div> <?php endwhile?> <!--page navigation--> <?php if (isset($next)): ?> <div class="nav"><a href='mygif.php?p=<?php echo $next?>'>Next</a></div> <script> $(document).ready( function(){ $('.gifs').gifplayer(); }); </script> <?php endif?> </div><!--galerie-->
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13 <script type="text/javascript"> $(document).ready(function() { // Infinite Ajax Scroll configuration jQuery.ias({ container : '.galerie, // main container where data goes to append item: '.vignette', // single items pagination: '.nav', // page navigation next: '.nav a', // next page selector loader: '<img src="css/img/ajax-loader.gif"/>', // loading gif triggerPageThreshold: 1 // show load more if scroll more than this }); }); </script>
Partager