Wie kann ich ein Bild anzeigen, wenn der browser unterstützt kein HTML5 - <video> tag

Weiß jemand, wie kann ich ein Bild anzuzeigen, das für die Browser, die nicht unterstützen, die tag ? Anzeige ein text wie in:

<video src="video.mp4" type="video/mp4">
    Your browser does not support the <video> tag
</video>

Ist einfach, aber wenn ich ersetzen Sie den text mit einem img-tag, es wird immer das Bild, auch wenn der browser unterstützt das video-tag.

Vielen Dank für das teilen Ihr wissen

(EDIT) Dies ist nicht der Fall, meine tests waren falsch und img-tag tatsächlich gerendert wird nur bei video wird nicht unterstützt (z.B. Safari 5)

InformationsquelleAutor mpaf | 2012-03-15
  1. 19

    Ich war nur die überprüfung dieser link, sowie HTML5-spec, also dieser code sollte auch bei dir funktionieren:

    <video controls="controls" poster="<your image poster if applicable>">
    <source src="video.mp4" type="video/mp4" />
    <img src="<your No video support image>" title="Your browser does not support the <video> tag" />
</video>
    • Danke, ja, es funktioniert! Meine Frage ist in der Tat falsch, der Browser, die ich getestet habe wird angezeigt <img> tag NUR, wenn <video> wird nicht unterstützt.
    • Ab Dez 2015, die img src unterstützt keine gifs. Wenn Sie möchten, ein fallback-gif, schauen Sie sich die poster - Attribut. Ich schrieb ein blog post mit einem Beispiel.
    InformationsquelleAutor DarkAjax
  2. 3

    Mithilfe von javascript, die Sie ausführen können:

    var html5video = !!document.createElement('video').canPlayType;

    Wird true oder false sein, je nachdem, ob Sie unterstützen oder nicht. Sie können dann unter Verwendung von javascript ersetzen Sie den video-tag mit einem Bild, oder, einfacher, nur das video auf display:none; und das Bild display:block; oder Umgekehrt.

    • das würde auch funktionieren denke ich mal, aber obige Antwort ist einfacher.
    • Ich nahm an, Sie hatte das ausprobiert und es hat nicht funktioniert! Naja, wenn ich jemals verwenden können !! (bang bang), macht es mich glücklich!
    InformationsquelleAutor Rich Bradshaw
Schreibe einen Kommentar