liens d'ouverture à l'intérieur d'une fancybox-fenêtre à l'intérieur de la même fenêtre fancybox

Question

Ceci est probablement pas si difficile, car sinon Iam sûr que je wouldv'e trouvé la réponse quelque part ...

Ce que je veux faire j'ouvrir un fancybox (le plugin jquery), le chargeant avec ajax-content, et quand je clique sur un lien à l'intérieur, il le charge avec un nouveau ajaxcontent, comme cliquer sur un lien dans un frame.

Des idées?

Answer 1

Vous pouvez

1. utiliser une iframe dans le fancybox (plus rapide & plus facile, ne pas utiliser ajax, mais fera que vous le souhaitez et le référencement plus facile) ou

2. mettre un div à l'intérieur de votre fancybox, remplissez-le en utilisant ajax et html(), puis liez l'événement a éléments 'click contenu à une fonction qui fera la même chose à nouveau.
   Notez que cette deuxième façon, vous n'aurez pas automatiquement le fonctionnement du bouton de retour du navigateur, plus difficile de SEO, etc.

Answer 2

Voici comment je le fais:

$('#fancybox-content a').live('hover', function(){ 
    $(this).fancybox(); 
    }); 

Cela fancybox- animer, y compris le redimensionnement, tout lien dans une fancybox.

Answer 3

je ne fais pas de code, mais il semble que je l'ai à travailler après avoir eu du mal pendant 5 heures

Si vous ouvrez un nouveau HTML/fichier PHP avec le fancybox cela ne fonctionne (IE9/ff/safari/chrome)

J'ai créé 4 pages - main.php/page1.php/page2.php/page3.php

main.php >> Utilisez le code fancybox (style selon les besoins)

$(document).ready(function() { 
    $("a.openModal").fancybox({ 
    'autoDimensions' : false, 
    'width'   : 750, 
    'height'  : 500, 
    'transitionIn'  : 'elastic', 
    'transitionOut'  : 'elastic', 
    'titleShow'  : false, 
    'hideOnContentClick' : false, 
    }); 
}); 

{a href = "page1.php" class = "openModal"} Nom de la page {/ a}

---

utilisateur clique sur le lien fancybox I spécifiés sur main.php (j'utilisé des classes comme je l'ai beaucoup de liens FancyBox sur une page)

Toutes les pages ont des liens entre eux (mais pas main.php)

---

page1.php & page2.php & page3.php - doivent avoir le même code identique que vous avez utilisé dans la page principale (sinon vous auriez le redimensionnement et la transition i quest)

page1.php

$(document).ready(function() { 
    $("a.openModal").fancybox({ 
    'autoDimensions' : false, 
    'width'   : 750, 
    'height'  : 500, 
    'transitionIn'  : 'elastic', 
    'transitionOut'  : 'elastic', 
    'titleShow'  : false, 
    'hideOnContentClick' : false, 
    }); 
}); 

• {a href = classe "page1.php" = "openModal"} Nom de la page {/ a}
• {a href = "page2.php "class =" openModal "} Nom de la page {/ a}
• {a href =" page3.php » class = "openModal"} Nom de la page {/ a}

---

fonctionne parfaitement pour moi - liens via fancybox Modal, vers une page et des liens puis à la page dans les Modal, des liens vers une autre page Modal (je suis allé 6 liens dans)

doit être un « plus facile » façon (correcte mot serait « droit ») -. mais cette solution de contournement est ma solution

Je ne l'ai pas testé avec des formes - et je impossible d'obtenir "javascript: history.go (-1)" au travail -

donc SEULEMENT va de l'avant (aide avec ce serait génial)

Answer 4

Utilisez le rappel onComplete (1.3 ou inférieur) ou afterShow (2.0+). Il suffit de lancer le même code que vous le feriez sur votre page pour activer la fancybox. J'aime le rendre fonctionnel, ainsi vous pouvez facilement l'appeler de nouveau.

function initFancybox() { 
    $("a.openModal").fancybox({options..., onComplete: initFancybox }); 
} 

Vous pouvez aussi le faire manuellement et utiliser un sélecteur si vous voulez seulement activer les liens de FancyBox dans le fancybox nouvellement ouvert. Cela pourrait être légèrement plus efficace.

function initFancybox(selector) { 
    if (selector == null) { selector = ""; } 
    $(selector+" a.openModal").fancybox({options..., 
    onComplete: function() { initFancybox("#fancybox-content"); } 
    }); 
} 

Answer 5

Oui, vous avez besoin d'une image (iframe). Fancybox doit savoir que le contenu de son chargement doit être traité comme un cadre afin que vous voudrez peut-être utiliser un

$('#contentclassorid').fancybox({ type: "iframe" });