If you wish to incorporate headless videos into your website, similar to using an image, you can utilize the clip component. This feature proves particularly useful when you desire a video to serve as the background of your site. The clip component automatically starts playing when it becomes visible within the user’s viewport, pauses when it is no longer visible, and loops seamlessly.
<mave-clip embed="{embed id}"></mave-clip>
In contrast to the player component, the clip component requires a processing period before playback is available. After uploading, the clip will automatically become ready for use once this processing is finalized
⚠️ To ensure optimal performance across various codecs, renditions created for our clip component are limited to a maximum duration of 60 seconds.
| Property | Description |
|---|---|
| embed | This points to a specific embed. |
| autoplay | Defaults to lazy, but you can provide always or off (to disable autoplay). |
| loop | Defaults true, but when provide false it can be disabled. |
| quality | Defaults to fhd, but you can choose any of the following options: sd, hd, fhd, qhd, uhd. If, for instance, qhd is specified but not available, it will select the next available option in line, such as fhd. |
| Method | Description |
|---|---|
| play() | To play the video when it has been paused. |
| pause() | To pause the video when it is playing. |
