LIGHTBOX
Use the data-uk-lightbox data attribute to show a popup box with an image. The lightbox utilizes the modal component to load images and videos to fit the entire modal box. You can configure the lightbox images to scroll through a gallery by setting the group parameter.
TOGGLE LIGHTBOX FROM BUTTON
USING THE LIGHTBOX IN A GALLERY
ADDING AN OVERLAY
I am text block. Click edit button to change this text. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.
. The
uk-overlay-panel class can be used to place an overlay panel that appears on hover. Additionally, you can use the following classes to animate the overlay panel:
| animation | Description |
|---|---|
uk-overlay-slide-top |
slide the overlay panel in from the top |
uk-overlay-slide-bottom |
slide the overlay panel in from the bottom |
uk-overlay-slide-left |
slide the overlay panel in from the left |
uk-overlay-slide-right |
slide the overlay panel in from the right |
uk-overlay-fade |
fade in the overlay panel |
| class | Description |
|---|---|
uk-overlay-top |
align the overlay panel to the top |
uk-overlay-bottom |
align the overlay panel to the bottom |
uk-overlay-left |
align the overlay panel to the left |
uk-overlay-right |
align the overlay panel to the right |
