- 3
- 4
- 3

John Doe Junior administrator

## Lightbox

## Single Image

Three simple popups with different scaling settings.

##### Default

##### Fits (Horz/Vert)

##### Effects

No gaps, zoom animation, close icon in top-right corner.

## Dialog with CSS animation

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

Open with fade-zoom animation
Open with fade-slide animation

# Dialog example

This is dummy copy. It is not meant to be read. It has been placed here solely to demonstrate the look and feel of finished, typeset text. Only for show. He who searches for meaning here will be sorely disappointed.

## Popup with video or map

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

Open YouTube Video
Open Vimeo Video
Open Google Map

Open YouTube Video
Open Vimeo Video
Open Google Map

## Ajax

You have full control of what is displayed in popup, align it to any side via CSS, enable or disable scroll on right side of window.

Load Ajax Content

## Gallery

Check the examples file `examples.lightbox.js` for more information.

You may put any HTML content in each gallery item and mix content types. In this example lazy-loading of images is enabled for the next image based on move direction.

## Zoom Gallery

Zoom effect works only with images.

## Form

Entered data is not lost if you open and close the popup or if you go to another page and then press back browser button.

Open Form

### Basic Form

Entered data is not lost if you open and close the popup or if you go to another page and then press back browser button.

Email
Password
Address
Address 2
City
State
Zip