|
If you face any issue in accessing the demo of the module, please contact us at [email protected]. Thanks.
|
All DnnZone's Modules are supported on DNN 4, 5, 6, & 7 platforms.
|
We have revised our upgrade policy - you will get life time free upgrades for all of our modules.
|
For demo/trial versions of our products, please contact us at [email protected]
|
At DnnZone, we also provide custom development services for your needs. We will try to provide quality services at better rates. You can contact us at [email protected]
|
|
|
Gallery with CSS3 Light-box is a DNN module for creating a nice looking light-box image gallery using CSS features only.
This is a neat light-box effect using only CSS. The idea is to have some thumbnails that are clickable, and once clicked, the respective large image is shown. Using CSS transitions and animations, we can make the large image appear in a fancy way. The thumbnail and light-box view are responsive and get adjusted with the available space. This new version supports transition effects for light-box and navigation. Following transitions are supported:
- Zoom In (View Demo)
- Zoom Out (View Demo)
- Fade (View Demo)
This module is built using HTML and CSS only. No Java-script or Flash is used. Transitions are only supported on browsers with CSS3 support, on other browsers, module should work fine but without the transitions.
Having the light-box gallery in CSS will give you speed and support on mobile and tablets.
You can review the product terms and license details here.
Module Configuration:
You can customize the settings for this module, including:
- Randomize Images
- Show Next/Previous (In light-box view)
- Container Width (Specify in % for responsive view)
- Transition (For light-box and navigation)
- Thumbnail Size
- Border Size
- Border Radius
- Background Color
Browser Support:

Live Demo:
You can access live demo here
Following screenshots describe the functionality of this module:
Module Settings Page:

Manage Images:


Responsive Image Thumbnail View:

CSS3 Light-box View:


You can find a blog post on how to use this module here.