Search code examples
javascriptjqueryfancybox

Fancybox - how can I show thumbnails by default?


How can I show these thumbnails by default? enter image description here

Live code example here
I am using Fancybox api for open lightbox by click.

        $.fancybox.defaults.buttons = ["zoom", "thumbs", "close" ];

        $('.fancybox-btn').click(function () {
            $.fancybox.open([
                {
                    src  : 'http://placehold.it/300x200?text=1',
                    opts : {
                        thumb   : 'http://placehold.it/300x200?text=1'
                    }
                },
                {
                    src  : 'http://placehold.it/300x200?text=2',
                    opts : {
                        thumb   : 'http://placehold.it/300x200?text=2'
                    }
                }
            ]);
        });

Solution

  • Add thumbs : { autoStart : true, }, option to second argument of $.fancybox.open:

    {
        loop : false,
        thumbs : {
            autoStart : true,
        },
    }