ouvrir Fancybox dans les onglets

Question

J'utilise PHP + jQuery + Fancybox dans mon projet. J'ai plusieurs onglets qui sont créés dynamiquement. J'ai une icône étoile sur chaque en-tête d'onglet et en cliquant dessus, je veux ouvrir une fancybox.

Mes onglets sont essentiellement ul-li avec le code dynamique suivant.

$("#tabs").append("<li class='current'><a class='tab' id='tab_" + 
    tabCnt + "<a href='#loginBox_div' class='login_link'> <img src='star.png' style='cursor:pointer'/> </a>" + "<a href='javascript:void(0);' class='remove'>x</a></li>"); 

dans mon fichier d'index:

$(document).ready(function() { 

     $("a.login_link").fancybox({ 
      'titlePosition'  : 'inside', 
      'transitionIn'  : 'none', 
      'transitionOut'  : 'none' 
     });  

    }); 

Le problème est que lorsque je clique sur l'icône étoile du premier onglet, le loginBox_div (fancybox) ouvre correctement. Mais lorsque mon deuxième onglet est créé et que je clique sur son icône étoile, la fancybox ne s'ouvre pas bien que la classe soit appliquée dans les onglets successifs. Aucune erreur javascript aussi. S'il vous plaît montrez-moi le chemin. Je vous remercie.

Answer 1

J'ai la solution :)
Je devais initialiser fancybox, c'est-à-dire écrire le code fancybox suivant, chaque fois que j'ouvrais un nouvel onglet. Assurez-vous que nous n'avons pas à faire cela pour le premier onglet car il est déjà initialisé dans le fichier d'index.

$("a.login_link").fancybox({ 
      'titlePosition'  : 'inside', 
      'transitionIn'  : 'none', 
      'transitionOut'  : 'none' 
     });