Types

The types don't have to be set by default as the lightbox is detecting them automatically, but if you are facing the CORS issue—you are getting sources from an external server and the lightbox shows the "Invalid source" message—setting them manually will solve this problem. The possible values of the attribute are "image", "video", and "youtube". In HTML, the type of a source can be set manually using the "data-type" attribute.

Additionally, the types can be set using JavaScript with the following props: the "types" array (declares the types individually) and the "type" string (declares the type for all sources).

fsLightbox.props.type = "image";
fsLightbox.props.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".