The Responsive Thumbnail Gallery is a jQuery plugin for creating image galleries that scale to fit their container. Apply it to a DOM element on the document ready event.
$(document).ready(function() {
var gallery = new $.ThumbnailGallery($('#gallery'));
});
You can configure the settings as follows
(example has the default config values assigned)
$(document).ready(function() {
var gallery = new $.ThumbnailGallery($('#gallery'), {
thumbImages: '_/img/thumbs/thumb',
smallImages: '_/img/small/image',
largeImages: '_/img/large/image',
count: 10,
thumbImageType: 'jpg',
imageType: 'jpg',
breakpoint: 600,
shadowStrength: 1
});
});
Parameters are:
thumbImages: path to the thumbnails
smallImages: path to the small size images
largeImages: path to the large size images
count: number of images/thumbnails
thumbImageType: file extension for thumbnail images (all should be the same)
imageType: file extension for gallery images (all should be the same)
breakpoint: width at which the small and large image sizes are swapped
shadowStrength: strength of the shadow on the non-selected thumbs (0-1)
Download: http://johnpolacek.github.com/ResponsiveThumbnailGallery/
| ←Previous CoffeeScript: iOS Home Screen Style | Popcorn.js: Free HTML5 Event System Next→ |
|---|
