JQuery Fancybox ne fonctionne pas après DIV recharger

Question

J'utilise Fancybox sur mon site pour ouvrir des liens vers d'autres pages (pages externes).

Fondamentalement, l'utilisateur clique sur une image et cela ouvre une fancybox contenant la page externe. Les liens d'image sont contenus dans une page (l'enfant) qui est affichée dans un DIV sur une autre page (le parent). Le parent a la possibilité de recharger les données dans la DIV en rechargeant la page enfant avec différents paramètres qui vont modifier l'image et les liens.

Tout cela fonctionne parfaitement avec la première charge. Mais après cela quand le DIV est rechargé avec la page enfant contenant des données différentes, le popup fancybox ne fonctionne plus. Si je fais un rafraîchissement F5 sur la page, cela fonctionne à nouveau. Mais seulement sur le premier chargement.

Le code sur la page d'enfant à fancybox de configuration pour les liens d'image:

$.noConflict(); 
$(document).ready(function() { 
    $(".userdetailslink").fancybox({ 
     'width'    : '80%', 
     'height'   : '80%', 
     'autoScale'   : false, 
     'transitionIn'  : 'elastic', 
     'transitionOut'  : 'elastic', 
     'type'    : 'iframe' 
    }); 
}); 

J'ai aussi essayé ce qui suit avec les mêmes résultats:

$.noConflict(); 
$(".userdetailslink").ready(function() { 
    $(".userdetailslink").fancybox({ 
     'width'    : '80%', 
     'height'   : '80%', 
     'autoScale'   : false, 
     'transitionIn'  : 'elastic', 
     'transitionOut'  : 'elastic', 
     'type'    : 'iframe' 
    }); 
}); 

Toute aide serait appréciée.

Answer 1

Utilisez-vous les méthodes AJAX pour charger la div? Vous pouvez utiliser la fonction de rappel pour appliquer la gestion des événements au contenu chargé.

$("div").load("url", function(){ 
     $(".userdetailslink").fancybox({ 
    'width'    : '80%', 
    'height'   : '80%', 
    'autoScale'   : false, 
    'transitionIn'  : 'elastic', 
    'transitionOut'  : 'elastic', 
    'type'    : 'iframe' 
    }); 

}); 

De cette façon, il fonctionne également après la charge. Bien sûr, vous faites la charge initiale comme vous êtes.