Mostrar ventana emergente de la galería fuera de iframe

Leí un hilo aquí, pero no encontré una buena solución para el elemento de la galería. No soy expery en jQuery así que por favor tengan paciencia conmigo aquí. Tengo un código para mostrar una imagen fuera de iframe. Pero mi objective es agregar la flecha izquierda / derecha para desplazarme por mi galería.

Tengo este script

 $(document).ready(function () { $('.fancybox').click(function (e) { e.preventDefault(); parent.$.fancybox({ type : "image", // force type of content to image href: this.href, title: this.title, helpers: { title: { type: 'inside' }, overlay: { opacity: 0.3 } // overlay //, buttons: {} } // helpers }); // fancybox }); // click });  

y mi código HTML es

   

FancyBox emergente funciona. Pero me gustaría agregar flechas para desplazarme por mi “elemento de galería”. Intenté agregar el código de galería .attr (‘rel’, ‘gallery’) justo encima del padre. $. Fancybox ({

pero la ventana emergente simplemente desaparece.

Agregar openEffect: ‘ninguno’, closeEffect: ‘ninguno’, nextEffect: ‘ninguno’, prevEffect: ‘ninguno’, relleno: 0, margen: [20, 60, 20, 60] // Aumentar el margen izquierdo / derecho

también hacer desaparecer la ventana emergente.

¿Es posible hacer eso?

Es posible que tengas que crear tus elementos de galería manualmente primero, así que prueba

 var gallery = []; jQuery(document).ready(function ($) { $(".fancybox").each(function (i) { var item = { href: this.href, title: this.title }; gallery.push(item); $(this).on("click", function () { parent.$.fancybox(gallery, { // API options index: i, // starts gallery from clicked item type: "image", // force type of content to image helpers: { title: { type: 'inside' } } // helpers }); // fancybox return false; }); // on }); // each }); // ready 

Aquí está el código de FancyBox que muestra la imagen de la Galería fuera de iframe

  

y el código html es como

   

esto funciona en IE, Firefox, Safari, pero no en Chrome.