Skip to content Skip to sidebar Skip to footer

Display Gallery Popup Outside Iframe

I read some thread in here, but I haven't found a good solution for gallery item. I am not expery in jQuery so please bear with me here. I have code to display one image outside if

Solution 1:

You may need to create your gallery elements manually first so try

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 optionsindex: i, // starts gallery from clicked itemtype: "image", // force type of content to imagehelpers: {
                    title: {
                        type: 'inside'
                    }
                } // helpers
            }); // fancyboxreturnfalse;
        }); // on
    }); // each
}); // ready

Solution 2:

Here is the code for FancyBox showing Gallery image outside iframe

<scripttype="text/javascript">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, {
                index: i, // starts gallery from clicked itemtype: "image", // force type of content to imagehelpers: {
                    title: {
                        type: 'inside'
                    },
                    overlay: {
                        opacity: 0.3
                    } // overlay
                } // helpers
            }); // fancyboxreturnfalse;
        }); // click
    });
});
</script>

and the html code is like

<arel="gallery"class="fancybox"href="images/01.jpg"title="test1"><imgalt=""src="thumbnails/01.jpg"/></a><arel="gallery"class="fancybox"href="images/02.jpg"title="test2"><imgalt=""src="thumbnails/02.jpg"/></a>

this works on IE, firefox, safari, but not Chrome.

Post a Comment for "Display Gallery Popup Outside Iframe"