Fullscreen Lightbox Javascript Fullscreen Lightbox ,React Fullscreen Lightbox Vue

Vue Lightbox Documentation

Learn how to use the Vue version of Fullscreen Lightbox.

Types

Sources' types can be set manually using the "types" array prop (declares the types individually) and the "type" string prop (declares the type for all sources). These props disable the automatic type detection, so if you are facing the CORS issue, they will solve this problem. The possible types are "image", "video", and "youtube".

<FsLightbox
:sources="["/Images/1.jpg", "/Images/2.jpg", "/Videos/1.mp4"]"
type="image"
:types="[null, null, "video"]"
/>

In the above example the "image" type was set globally, but for the third source it was overwritten with the type "video". So, finally, the types of the sources are consecutively "image", "image", and "video".

Look over Fullscreen Lightbox open source plug-ins.