Search code examples
jquerycssjquery-pluginssupersized

jQuery Supersized Plugin: Placing the thumbnails in a different location


Is it possible to place the thumbnails that Supersized generates in a different location on the page?

I can see that api.options.slides would give me the slides and thumb paths. Can I somehow use this to recreate the thumbnails somewhere else on the page?

I'd like to put the thumbnails on the left sidebar for example.

Sample Page


Solution

  • Here is how I implemented it:

    if ( $("#supersized").length ) {
        $('.container').append('<ul class="cloned-thumbs"></ul>');
        for (var i = 0; i < api.options.slides.length; i++) {
            $('.cloned-thumbs').append('<li><img onclick="javascript: api.goTo(' + (i+1) +')" src="' + api.options.slides[i].thumb + '"></li>');
        }
    }