content-video
Description
A basic element for showing videos using VideoJS. Supports YouTube only at the moment.
Benefits
Uses IntersectionObserver to lazy load the YouTube player when user has scrolled the video into view.
Properties
| Property |
Attribute |
Description |
Type |
Default |
autoplay |
autoplay |
If you're using this inside a content-overlay for example, you may want the video to play immediately on launch. |
boolean |
false |
class |
class |
|
string |
'' |
controls |
controls |
|
boolean |
true |
fitContainer |
fit-container |
Fit the container this video is placed in. When the video is used in an overlay or another place where the video will takeover the existing height, it is recommended to enable this option. |
string |
'false' |
height |
height |
|
number |
9 |
method |
method |
|
"html5" | "youtube" |
'youtube' |
playButtonAriaLabel |
play-button-aria-label |
|
string |
'Play' |
preload |
preload |
|
string |
'metadata' |
src |
src |
Supports YouTube and self hosted URLs. |
string |
'' |
type |
type |
|
string |
'video/mp4' |
width |
width |
|
number |
16 |
Slots
| Slot |
Description |
|
Default slot, same as content slot. |
"content" |
Adjacent to no-js message for video. Usually not needed. |
"no-js-message" |
Contents of no JS message. |
"playButton" |
Play button contents. |
"poster" |
Poster shown before video is played. |