Wenn Sie Headless-Videos ähnlich wie bei der Verwendung eines Bildes in Ihre Website integrieren möchten, können Sie die Clip-Komponente verwenden. Diese Funktion erweist sich als besonders nützlich, wenn Sie ein Video als Hintergrund für Ihre Website verwenden möchten. Die Clip-Komponente beginnt automatisch mit der Wiedergabe, wenn sie im Ansichtsfenster des Benutzers sichtbar wird, pausiert, wenn sie nicht mehr sichtbar ist, und läuft nahtlos in einer Schleife ab.
<script
type="module"
src="https://cdn.video-dns.com/npm/@maveio/components/+esm"
></script>
<mave-clip embed="{embed id}"></mave-clip>Im Gegensatz zur Player-Komponente benötigt die Clip-Komponente eine Verarbeitungszeit, bevor die Wiedergabe verfügbar ist. Nach dem Hochladen ist der Clip automatisch einsatzbereit, sobald die Verarbeitung abgeschlossen ist
⚠️ Um eine optimale Leistung über verschiedene Codecs hinweg zu gewährleisten, sind die für unsere Clip-Komponente erstellten Wiedergaben auf eine maximale Dauer von 60 Sekunden begrenzt.
| Attribut | Beschreibung |
|---|---|
| embed | Dies weist auf eine bestimmte Einbettung hin. |
| autoplay | Der Standardwert ist lazy, Sie können jedoch always oder off angeben (um die automatische Wiedergabe zu deaktivieren). |
| loop | Standardmäßig ist true, aber wenn false bereitgestellt wird, kann es deaktiviert werden. |
| quality | Der Standardwert ist fhd, Sie können jedoch eine der folgenden Optionen auswählen: sd, hd, fhd, qhd, uhd. Wenn beispielsweise qhd angegeben, aber nicht verfügbar ist, wird die nächste verfügbare Option in der Zeile ausgewählt, z. B. fhd. |
| fallback | Der Standardwert ist placeholder, ein Player-ähnliches Bild, das verwendet wird, wenn ein Video z. B. aufgrund von Problemen nicht abgespielt werden kann. Batterie schwach. Sie können es auf thumbnail einstellen, wenn Sie das benutzerdefinierte Miniaturbild oder den Anfangsrahmen als Ersatz verwenden möchten. |
| Methode | Beschreibung |
|---|---|
| play() | Um das Video abzuspielen, wenn es angehalten wurde. |
| pause() | Um das Video während der Wiedergabe anzuhalten. |
| Eigentum | Beschreibung |
|---|---|
| duration | Gibt einen Promise<number> zurück, der die Dauer des Clips (nicht des Originalvideos) als Float zurückgibt. |
| currentTime | Gibt die aktuelle Zeit des Videos zurück oder legt sie fest. |