LightBox Gallery

Official Website

Single image lightbox

Three simple popups with different scaling settings.
1 — fits horizontally and vertically,
2 — only horizontally,
3 — no gaps, zoom animation, close icon in top-right corner.

lightbox-imagelightbox-imagelightbox-image

Lightbox gallery

In this example lazy-loading of images is enabled for the next image based on move direction.

Zoom gallery

If you wish to open the popup only after image is fully loaded, you may preload image via JS. Or use scaled down image instead of thumbnail. Zoom effect works only with images, for now.

Popup with video or map

In this example lightboxes are automatically disabled on small screen size and default behavior of link is triggered.

Popup With css Animations

Animations are added with simple CSS transitions, you can make them look however you wish.

Modal popup

A modal popup disables the usual ways to close popups.