+ Répondre à la discussion
Affichage des résultats 1 à 2 sur 2
  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 :
    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 :
    $(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.

Liens sociaux

Règles de messages

  • Vous ne pouvez pas créer de nouvelles discussions
  • Vous ne pouvez pas envoyer des réponses
  • Vous ne pouvez pas envoyer des pièces jointes
  • Vous ne pouvez pas modifier vos messages
  •