Ich versuche ein Tag zu verwenden, um ein Bild des Videos anzuzeigen, aber wenn das Videoformat nicht unterstützt wird oder die URL nicht gefunden wird, können wir ein Platzhalterbild ersetzen es? Bitte sagen Sie mir eine Lösung, die funktioniert.So zeigen Sie einen Platzhalter an, wenn die Videoanzeige fehlgeschlagen ist
Dank/Yang
Sie für das Video warten konnte in einem Bereitschaftszustand sein, wie:
var video = document.getElementById("videoId");
if (video.readyState === 4) {
// change the img tag z-index with a lower z-index than the video
}
Dieses Javascript sagt, dass, wenn das Video vollständig geladen wird es ersetzt (eigentlich geht es auf der Oberseite) ein Bild, das bedeckte es. In HTML fügen Sie ein IMG-Tag mit einem Vorschaubild ein, das angezeigt wird, bis das Video geladen ist, und Sie erstellen ein spezifisches CSS für IMG- und Videoelemente. Setzen Sie die Position auf absolut oder fest oder relativ und wenden Sie einen Z-Index von 2 für das img und 1 für das Videoelement an, sodass das Bild über dem Video-Tag überlappt. In Javascript, wenn das Video vollständig geladen ist, können Sie die CSS der IMG- und Video-Elemente ändern, indem Sie ihren Z-Index von 2 zu 1 und von 1 zu 2 austauschen, oder indem Sie die img display -Eigenschaft auf keine setzen .
Hoffe das half!
Werfen Sie einen Blick in die Dokumentation zu mozilla https://developer.mozilla.org/en-US/docs/Web/API/HTMLMediaElement
, wenn Sie es mit Hilfe von Javascript steuern, wenn ja verwenden „wenn sonst“ Bedingung, die als 2 Platzhalter (Hintergrundbild) ein Standard sein wird, die keine Vorschau und zweiten Mittel werden die Videos Platzhalter .
Vielen Dank für Ihre Antwort. –