Wie überprüft man, ob der Browser mp4 via HTML5-Video-Tag abspielen kann?Wie überprüft man, ob der Browser mp4 via HTML5-Video-Tag abspielen kann?
Antwort
Dieser folgenden Link erklärt, wie:
Dies könnte Ihnen helfen:
<script type="text/javascript">'.
var canPlay = false;
var v = document.createElement('video');
if(v.canPlayType && v.canPlayType('video/mp4').replace(/no/, '')) {
canPlay = true;
}
alert(canPlay);
</script>
Alex Polos Kommentar oben ist genau das, was Sie brauchen. Außerdem gibt es einen guten Grund, nach der Fähigkeit des Browsers zu suchen, ein Videoformat abzuspielen. Firefox unterstützt MP4 nicht. Chrome, Safari, MobileSafari und IE9 tun dies. Selbst wenn Sie ein Flash-Player-Fallback verwenden (in der Art, wie Sie ein JPEG-Fallback für Browser anzeigen, die kein HTML5-Video unterstützen), greift Firefox nicht darauf zurück und zeigt stattdessen einen kaputten Videoplayer an. – ZiggyTheHamster
Alex Polo Antwort ist nicht schlecht, aber unvollständig dies versuchen zu überprüfen, ob der Codec auch unterstützt wird:
var mp4Supported = (!!document.createElement('video').canPlayType('video/mp4; codecs=avc1.42E01E,mp4a.40.2'));
Ebenso für ogg, webm und so weiter .. Funktioniert auch mit audio :)
Ich muss überprüfen, ob das html5 video angezeigt wird, um meine persönliche taste zu verstecken und audio in ie7 und ie8 auszuschalten. Meine Lösung ist unten gezeigt.
Mein html:
<div id="contenitore_video" style="position:absolute;top:0;left:0;">
<video id="cont_video" autoplay onFocus="this.blur();" width="100%" height="100%" >
<source src="video/xxx.mp4" type="video/mp4" />
<source src="video/xxx.theora.ogv" type="video/ogg" />
<div id="sfondo_ridimensionato" >
<img src="img/sfondo_home1.jpg" >
</div>
</video>
</div>
...
<div id="controlli_video" style="position:absolute; top:10px;right:25px; height:50px; text-align:right;">
<a class="video_play" onFocus="this.blur();" style="display:none;" href="javascript:void(0)" onClick="controlla_video(1)">Play</a> ...
</div
Mein JS bereit:
$(document).ready(function(){
//controllo se il video funziona o si vede il video alternativo
// var numero = $('#sfondo_ridimensionato:hidden').length;
// alert(numero);
if($('#sfondo_ridimensionato:hidden').length == 0){
$('#controlli_video').hide();
}
}
, zu denen Links [HTML5-Funktionen Erkennung] (http://diveintohtml5.org/detect.html#video), die besagt, "Das'
Ja, aber wenn Sie nur 1 Videoformat unterstützen können, ist eine Erkennung erforderlich. Wie ich bereits sagte, sollen CSS und andere Technologien in ähnlicher Weise funktionieren, aber wir alle wissen, dass Sie Erkennung und Hacks benötigen. die ursprüngliche Frage mit "nur funktioniert" zu beantworten, löst oder beantwortet die Frage nicht wirklich. der Link, den ich gepostet habe, tut es. – Justin808
Nein, so funktioniert das 'video'-Tag nicht. Bitte lesen Sie etwas darüber, bevor Sie Dinge ohne Grundlage sagen. Der ** ganze Punkt ** des 'video' Tags ist die Formatunabhängigkeit und die Art und Weise, wie dies geschieht, durch Fallbacks. Möchten Sie nur ein einzelnes Videoformat unterstützen? Groß! Tun Sie das und schließen Sie ein JPG als Fallback ein. Ende der Geschichte. [Natürlich, * warum * würdest du das 'video'-Tag verwenden, wenn du nur unterstützen willst, sagen wir, Flash ist eine andere Frage, aber das wurde nicht gefragt.] – Dori