EverWeb Widgets

ThemeKit Shutter Gallery

Shutter Gallery

The gallery has an auto grid layout for displaying images of varying aspect ratio in a uniform grid by setting min-with and row height.
In this example the min-width is set to 360px and the row height to 320px.
Captions
The thumbnail has a shutter overlay with the caption in the top shutter and the description in the bottom one.
The overlay appears on hover on computers and on load when viewed on mobile touch devices.
The mobile overlay has its own controls for color and opacity and there is an extra control for setting the thumbnail spacing when they are stacked one above the oter when viewed on mobile phones in portrait mode.
Gallery
The gallery has all the usual controls plus the option to change the overlay and caption background color and their opacity.
Lazy Load
The gallery images are lazy load with an option to preload the previous and next images.
The thumbnail images have optional lazy loading. This should be turned on just before publishing since some or all of the thumbnails will disappear when viewed on the EverWeb design canvas.