disableLocalStorage
To improve the performance, the lightbox caches detected types in the local storage. To disable it, set the "disableLocalStorage" prop to "true".
<FsLightbox
disableLocalStorage={true}
/>Other props
exitFullscreenOnClose
By default, the lightbox won't exit the fullscreen on close. To change it, set the "exitFullscreenOnClose" prop to "true".
<FsLightbox
exitFullscreenOnClose={true}
/>loadOnlyCurrentSource
By default, the lightbox loads 3 stage sources—after opening and after a slide change—previous, current, and next. If the "loadOnlyCurrentSource" prop is set to "true", the lightbox will load only the current source.
<FsLightbox
loadOnlyCurrentSource={true}
/>maxYoutubeVideoDimensions
The lightbox cannot detect maximum sizes of YouTube videos (however, by default it sets them to 1920 × 1080). To change them use the "maxYoutubeVideoDimensions" object prop.
<FsLightbox
maxYoutubeVideoDimensions={{ width: 1920, height: 1080 }}
/>slideDistance
The distance between the slides visible during swiping—x * window.innerWidth (by default, 0.3).
<FsLightbox
slideDistance={0.5}
/>svg Pro
To edit the properties of the toolbar and slide buttons, edit the "svg" prop in an analogous way to the given example (there are 5 editable props for each button):
<FsLightbox
svg={{
toolbarButtons: {
thumbs: {
viewBox: "0 0 278 278",
width: "17px",
height: 17px",
d: "M0 0 H119.054 V119.054 H0 V0 z M158.946 0 H278 V119.054 H158.946 V0 z M158.946 158.946 H278 V278 H158.946 V158.946 z M0 158.946 H119.054 V278 H0 V158.946 z",
title: "Preview"
},
zoomIn: {
width: "20px"
},
zoomOut: {
height: "20px"
},
slideshow: {
start: {
width: "20px"
},
pause: {
viewBox: "0 0 31 31"
}
}
fullscreen: {
enter: {
title: "Fullscreen — Show",
},
exit: {
title: "Fullscreen — Exit"
}
},
close: {
height: "32px"
}
},
slideButtons: {
previous: {
width: "40px",
},
next: {
title: "Next"
}
}
}}
/>slideshowTime Pro
When slideshow is turned on, the time that needs to pass to change the slide to the next one (in milliseconds).
<FsLightbox
slideshowTime={10000}
/>UIFadeOutTime Pro
The time after which the lightbox's UI fades out (in milliseconds).
<FsLightbox
UIFadeOutTime={10000}
/>zoomIncrement Pro
The value that increases the source's scale on a click zoom (by default, 0.25—that is, the size of the source is increased by 25%).
<FsLightbox
zoomIncrement={0.5}
/>