Abra Fancybox desde Fancybox y cierre el padre

Tengo problemas con fancybox. Mi producto se está abriendo en fancybox y tengo productos relacionados dentro del contenido. Me gustaría cerrar fancybox cuando el usuario hace clic en un enlace relacionado y abrir el producto en un nuevo fancybox.

Gracias chicos por su ayuda. Pero no funciona :( . El producto se abre en una ventana sin fancybox.

    $(document).ready(function() {
$("a#fancy1").fancybox({
        'speedIn'           : 600, 
        'speedOut'          : 200, 
        'overlayShow'       : false,
        'autoDimensions'    : false,
        'width'             : 620,
        'height'            : 'auto',
        'overlayShow'       : true,
        'overlayOpacity'    : 0.8,
        'overlayColor'      : '#ccc'
});
$("a#fancy2").fancybox({
        'speedIn'           : 600, 
        'speedOut'          : 200, 
        'overlayShow'       : false,
        'autoDimensions'    : false,
        'width'             : 620,
        'height'            : 'auto',
        'overlayShow'       : true,
        'overlayOpacity'    : 0.8,
        'overlayColor'      : '#ccc'
}); 
}); 

Esto es lo que tengo. Al hacer clic en el producto se abre fancybox "fancy1". Pero al hacer clic en el enlace de fancybox se abre un producto relacionado sin fantasía y obtengo:

($ no está definido $(function(){$('#form_2538').validate();});)!

Vincular a un producto hecho de esta manera

<a id="fancy1" href="product_url" >

Vincular a un relacionado hecho de esta manera

<a id="fancy2" href="product_url" >

He estado luchando con esto por un tiempo :(

Y LO HE RESUELTO!!!!!!!!!!!!!!!!!!!

¡¡He resuelto el problema!!

¡Por favor ver más abajo!

    $(document).ready(function() {

$("a.fancy1").live("hover",
        function()
        {$("a.fancy1").fancybox({
        'speedIn'           : 600, 
        'speedOut'          : 200, 
        'overlayShow'       : false,
        'autoDimensions'    : false,
        'width'             : 620,
        'height'            : 'auto',
        'overlayShow'       : true,
        'overlayOpacity'    : 0.8,
        'overlayColor'      : '#ccc'

        });
        });
    });

preguntado el 21 de mayo de 12 a las 19:05

este error ($ is not defined $(function(){$('#form_2538').validate();});) parece no estar relacionado con fancybox y también podría estar roto el script fancybox. Verifique la configuración de su script de validación. -

2 Respuestas

Tienes que vincular fancybox para cada enlace por separado como

$("a#fancy1").fancybox({
// options
});
$("a#fancy2").fancybox({
// options
});

Tenga en cuenta que el segundo script no está dentro del primero (onClosed opción).

Abra el primer fancybox como:

<a id="fancy1" href="{link to product}">open product</a>

Luego, dentro del contenido abierto, debe tener un enlace como

<a id="fancy2" href="{target to related product}">see related product</a>

en realidad no tienes que cerrar el primer fancybox, enlazar al segundo desde adentro lo cerrará.

contestado el 22 de mayo de 12 a las 00:05

como puede ver en el ejemplo anterior, he seguido su sugerencia y aún no obtengo ningún resultado. Triste. - Hércules S.

Gracias JFK. Su solución funcionó. Tuve que usar $("a#fancy1").fancybox({ // opciones }); $("a#fancy1").fancybox({ // opciones }); ¡DOS VECES! ¡Pero! Abrir el producto con fancybox y hacer clic en el producto relacionado dentro de él funciona solo 1 vez. Si abro un producto relacionado que también tiene productos relacionados, no funciona... - Hércules S.

<a href="product_url" id="fancy2">Link</a>

<script>
$('#fancy2').click(function()
{
    $(this).parent().fancybox.close();
});
</script>

OR

<script>
$('#fancy2').click(function()
{
    $('a#fancy1').trigger('click');
});
</script>

contestado el 21 de mayo de 12 a las 19:05

Soy un poco nuevo en js. ¡No lo entendí! ¿Dónde lo pongo? Al igual que: ? - Hércules S.

Bueno, necesitas marcar el ritmo del código en $(document).ready(function() { /*colocar el código aquí */ }); - Waqar Alamgir

y supongo que necesitas hacer esto para cada enlace? $('a').each(function(){ $(this).fancybox({ // opciones }); }); - Waqar Alamgir

No es la respuesta que estás buscando? Examinar otras preguntas etiquetadas or haz tu propia pregunta.