p
u
b
l
i
c
i
t
é
publicité
  1. #1
    Invité de passage
    Homme Profil pro
    Architecte réseau
    Inscrit en
    novembre 2011
    Messages
    13
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Corrèze (Limousin)

    Informations professionnelles :
    Activité : Architecte réseau
    Secteur : Finance

    Informations forums :
    Inscription : novembre 2011
    Messages : 13
    Points : 0
    Points
    0

    Par défaut 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 : 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
    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 !

  2. #2
    Invité de passage
    Homme Profil pro
    Architecte réseau
    Inscrit en
    novembre 2011
    Messages
    13
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Corrèze (Limousin)

    Informations professionnelles :
    Activité : Architecte réseau
    Secteur : Finance

    Informations forums :
    Inscription : novembre 2011
    Messages : 13
    Points : 0
    Points
    0

    Par défaut

    J'ai résolu mon problème, voilà la marche à suivre :

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    $(document).on("click","a.poplight[href^=#]",function(){
    Il faut utilisé document, aucune autre méthodes fonctionnent.
    En espérant que cela soit utile pour d'autres personnes.

Discussions similaires

  1. jScroll - scroll infini avec jQuery
    Par flobrflo dans le forum jQuery
    Réponses: 1
    Dernier message: 15/05/2013, 15h39
  2. Problème de scrolling infini
    Par maximus35 dans le forum C
    Réponses: 3
    Dernier message: 01/03/2012, 22h42
  3. scroll infini jquery
    Par linuxien_tun dans le forum jQuery
    Réponses: 2
    Dernier message: 26/12/2011, 11h16

Partager

Partager
  • Envoyer la discussion sur Viadeo
  • Envoyer la discussion sur Twitter
  • Envoyer la discussion sur Google
  • Envoyer la discussion sur Facebook
  • Envoyer la discussion sur Digg
  • Envoyer la discussion sur Delicious
  • Envoyer la discussion sur MySpace
  • Envoyer la discussion sur Yahoo