| mode |
'lg-slide' |
Type of transition between images. lightGallery comes with lots of transition effects such as 'lg-slide''lg-fade''lg-zoom-in''lg-zoom-in-big''lg-zoom-out''lg-zoom-out-big''lg-zoom-out-in''lg-zoom-in-out''lg-soft-zoom''lg-scale-up''lg-slide-circular''lg-slide-circular-vertical''lg-slide-vertical''lg-slide-vertical-growth''lg-slide-skew-only''lg-slide-skew-only-rev''lg-slide-skew-only-y''lg-slide-skew-only-y-rev''lg-slide-skew''lg-slide-skew-rev''lg-slide-skew-cross''lg-slide-skew-cross-rev''lg-slide-skew-ver''lg-slide-skew-ver-rev''lg-slide-skew-ver-cross''lg-slide-skew-ver-cross-rev''lg-lollipop''lg-lollipop-rev''lg-rotate''lg-rotate-rev''lg-tube' |
| cssEasing |
'ease' |
Type of easing to be used for animations |
| speed |
600 |
Transition duration (in ms). |
| hideBarsDelay |
6000 |
Delay for hiding gallery controls in ms |
| useLeft |
false |
force lightgallery to use css left property instead of transform. |
| closable |
true |
allows clicks on dimmer to close gallery. |
| loop |
true |
If false, will disable the ability to loop back to the beginning of the gallery when on the last element. |
| keyPress |
true |
Enable keyboard navigation |
| controls |
true |
If false, prev/next buttons will not be displayed. |
| slideEndAnimatoin |
true |
Enable slideEnd animation |
| hideControlOnEnd |
false |
If true, prev/next button will be hidden on first/last image. |
| mousewheel |
true |
Change slide on mousewheel |
| preload |
1 |
Number of preload slides. will exicute only after the current slide is fully loaded. ex:// you clicked on 4th image and if preload = 1 then 3rd slide and 5th slide will be loaded in the background after the 4th slide is fully loaded.. if preload is 2 then 2nd 3rd 5th 6th slides will be preloaded |
| showAfterLoad |
true |
Show Content once it is fully loaded |
| counter |
true |
Whether to show total number of images and index number of currently displayed image. |
| swipeThreshold |
50 |
By setting the swipeThreshold (in px) you can set how far the user must swipe for the next/prev image. |
| enableDrag |
true |
Enables desktop mouse drag support |
| thumbnail |
true |
Enable thumbnails for the gallery |
| animateThumb |
true |
Enable thumbnail animation. |
| currentPagerPosition |
'middle' |
Position of selected thumbnail. 'left' or 'middle' or 'right' |
| thumbWidth |
100 |
Width of each thumbnails. |
| thumbContHeight |
100 |
Height of the thumbnail container including padding and border |
| thumbMargin |
5 |
Spacing between each thumbnails |
| toogleThumb |
true |
Whether to display thumbnail toggle button. |
| enableThumbDrag |
true |
Enables desktop mouse drag support for thumbnails. |
| swipeThreshold |
50 |
By setting the swipeThreshold (in px) you can set how far the user must swipe for the next/prev slide. |
| autoplay |
true |
Enable gallery autoplay |
| pause |
5000 |
The time (in ms) between each auto transition. |
| progressBar |
true |
Enable autoplay progress bar |
| fourceAutoplay |
false |
If false autoplay will be stopped after first user action |
| autoplayControls |
true |
Show/hide autoplay controls. |
| pager |
true |
Enable/Disable pager |
| zoom |
true |
Enable/Disable zoom option |
| scale |
1 |
Value of zoom should be incremented/decremented |