Fullscreen Lightbox Javascript Fullscreen Lightbox ,React Fullscreen Lightbox Vue

Vue Fullscreen Lightbox

An overview.

Vue Fullscreen Lightbox

A simple and powerful lightbox as a Vue.js component.

A Vue.js plug-in for displaying images, videos, or, through custom sources, anything you want in a clean overlying box. Supports SSR.

Learn more about Vue FsLightbox!

<template>
<div>
<button @click="toggler = !toggler">
Open the lightbox.
</button>

<FsLightbox
:toggler="toggler"
:sources="[
'https://i.imgur.com/fsyrScY.jpg',
'https://www.youtube.com/watch?v=3nQNiWdeH2Q',
'https://commondatastorage.googleapis.com/gtv-videos-bucket/sample/BigBuckBunny.mp4'
]"
/>
</div>
</template>

<script>
import FsLightbox from "fslightbox-vue/v3";
// import FsLightbox from "fslightbox-vue/v2"; for Vue 2

export default {
components: { FsLightbox },
data() {
return {
toggler: false
}
}
}
</script>

If you want to see more advanced options, visit the documentation.

Check out how the basic version of Vue Fullscreen Lightbox works.
Check out how the Pro version of Vue Fullscreen Lightbox works.
The basic version is available under the MIT license. The pro version's User License Agreement is available on the licenses page.

Pro

Size: 62.6K
Thumbnails
Zooming
More toolbar buttons
Captions
Custom animations

$19.90 or $39.90

Depending on a license.
VAT may be added.
Look over the Fullscreen Lightbox open source plug-ins.