Galleria Demo 02


This demonstration shows you a pretty straight-forward image gallery create with Galleria. The markup is virtually the same as in demo 01 but the outcome is much more simplified. The history object is not set here, so the back button doesn't take you to the previous image. In this example we also disabled the nextClick, so the image is not clickable. We also skipped all the event functions and effects for the images.

By not defining any active class in the list, the gallery will start with an empty box before action is taken through the thumbnails. I also moved the caption here and positioned it absolute below the images. Also, please note the 'noslace' class applied to the fourth image (ladybug). This prevents the thumbnail from scaling and is just centered instead. This example also demonstrates how easy it is to alter the thumbnail container proportions in CSS.

This gallery was created from a simple unordered list with images - thumbnails and functionality is all in the Galleria plugin. Viewing this page without javascript or CSS enabled with degrade it into a list of full-size images.

Visit the galleria project: