Kompatibilitätsprobleme beim Einfügen von Audiodateien in HTML und beim Abspielen in Browsern
|
Lassen Sie uns über einige Probleme sprechen, die bei mir nach dem Einfügen von Audiodateien in HTML (beim Abspielen von MP3-Dateien) aufgetreten sind: 1. <embed type="audio/mp3" src="" autostart=true loop=false></embed> Problem: Es funktioniert gut auf IE8 (über Media Player-Plugin), aber nicht auf IE6 und IE7 Sie müssen das QuickTime-Plugin installieren, um es in Firefox abspielen zu können Chrome konvertiert es in das Tag <vidio> in HTML5, das zwar abgespielt werden kann, aber auf dem gesamten Bildschirm einen Bluescreen verursacht. Opera wird nicht automatisch abgespielt 2. <embed type="audio/midi" src="" autostart=true loop=false></embed> Problem: Das Video wird unter IE6 und IE7 nicht richtig abgespielt, unter IE8 funktioniert es jedoch einwandfrei. Normal unter Firefox Für die ordnungsgemäße Wiedergabe ist für Chrome ein fehlerhaftes QuickTime-Plug-In erforderlich Opera wird nicht automatisch abgespielt 3. <Objektdaten="" /> Problem: Das Video kann nicht auf IE6 und 7 abgespielt werden. IE8 zeigt die Meldung „Articx wird nicht normal verwendet“ an. Normal unter Firefox Normal unter Chrome Opera unterstützt nicht 4. <audio src="" type="audio/mp3" /> Problem: HTML5-Tags werden nur von Chrome unterstützt 5. Code kopieren Der Code lautet wie folgt:<Audio-Autoplay> <Quelle src="" Typ="audio/mp3" /> <embed src="" type="audio/mp3"/> </audio> Problem: IE6 und IE7 unterstützen es nicht, andere Browser jedoch schon. Opera kann es nicht automatisch abspielen. 6. <embed src=""><noembed><bgsound src=""></noembed> Problem: IE6 und IE7 werden nicht unterstützt, andere Browser werden unterstützt, Opera kann nicht automatisch abspielen Basierend auf dem oben Gesagten habe ich die folgende Methode übernommen (ausgeführt unter jQuery): Code kopieren Der Code lautet wie folgt:wenn (navigator.userAgent.indexOf("Chrome") > -1) { Wenn es Chrome ist: <audio src="" type="audio/mp3" autoplay="autoplay" hidden="true"></audio> }sonst wenn (navigator.userAgent.indexOf("Firefox")!=-1) { Wenn es Firefox ist: <embed src="" type="audio/mp3" hidden="true" loop="false" Mastersound></embed> }else if (navigator.appName.indexOf("Microsoft Internet Explorer")!=-1 && document.all) { Wenn es IE(6,7,8) ist: <object classid="clsid:22D6F312-B0F6-11D0-94AB-0080C74C7E95"><param name="AutoStart" value="1" /><param name="Src" value="" /></object> }sonst wenn (navigator.appName.indexOf("Opera")!=-1) { Wenn es Oprea ist: <embed src="" type="audio/mpeg" loop="false"></embed> }anders{ <embed src="" type="audio/mp3" hidden="true" loop="false" Mastersound></embed> } oder Code kopieren Der Code lautet wie folgt:var ua = navigator.userAgent.toLowerCase(); wenn(ua.match(/msie ([\d.]+)/)){ jQuery('#__alert_sound').html('<object classid="clsid:22D6F312-B0F6-11D0-94AB-0080C74C7E95"><param name="AutoStart" value="1" /><param name="Src" value="/sounds/alert/1.mp3" /></object>'); } sonst wenn(ua.match(/firefox\/([\d.]+)/)){ jQuery('#__alert_sound').html('<embed src="/sounds/alert/1.mp3" type="audio/mp3" hidden="true" loop="false" mastersound></embed>'); } sonst wenn(ua.match(/chrome\/([\d.]+)/)){ jQuery('#__alert_sound').html('<audio src="/sounds/alert/1.mp3" type="audio/mp3" autoplay="autoplay" hidden="true"></audio>'); } sonst wenn (ua.match(/opera.([\d.]+)/)){ jQuery('#__alert_sound').html('<embed src="/sounds/alert/1.mp3" hidden="true" loop="false"><noembed><bgsounds src="/sounds/alert/1.mp3"></noembed>'); } sonst wenn(ua.match(/version\/([\d.]+).*safari/)){ jQuery('#__alert_sound').html('<audio src="/sounds/alert/1.mp3" type="audio/mp3" autoplay="autoplay" hidden="true"></audio>'); } anders { jQuery('#__alert_sound').html('<embed src="/sounds/alert/1.mp3" type="audio/mp3" hidden="true" loop="false" mastersound></embed>'); } |
<<: Einige Erfahrungen in der Selbstkultivierung von Künstlern
>>: Bringen Sie Ihnen Schritt für Schritt bei, wie Sie die vue3.0-Projektarchitektur erstellen
Artikel empfehlen
MySQL verwendet einen abdeckenden Index, um Tabellenrückgaben zu vermeiden und die Abfrage zu optimieren
Vorwort Bevor wir über den Deckungsindex sprechen...
Eine kurze Diskussion über den CSS-Kaskadierungsmechanismus
Warum hat CSS einen Kaskadierungsmechanismus? Da ...
So ändern Sie das Root-Passwort in einem Container mit Docker
1. Verwenden Sie den folgenden Befehl, um das SSH...
Reines CSS, um einen bewölkten Wettersymboleffekt zu erzielen
Wirkung Die Wirkung ist wie folgt Umsetzungside...
CSS implementiert verschiedene Ladeeffekte mit Parsing-Prozess
HTML <div Klasse="Spinner"></d...
Erklärung zur Verbindung des Mac mit Remote-Servern über SSH in verschiedenen Terminals
Mac verwendet Shell (Terminal) SSH, um eine Verbi...
So fragen Sie ab, ob die MySQL-Tabelle gesperrt ist
Spezifische Methode: (Empfohlenes Tutorial: Lern-...
Zwei Möglichkeiten zur Lösung des Problems, dass die MySQL-Master-Slave-Datenbank nicht synchronisiert wird
Inhaltsverzeichnis Zwei Möglichkeiten zur Lösung ...
MySQL-Variablenprinzipien und Anwendungsbeispiele
In der MySQL-Dokumentation können MySQL-Variablen...
Zusammenfassung der Methode von React zum Erstellen von Komponenten
Inhaltsverzeichnis 1. Komponenten mit Funktionen ...
Vue3+TypeScript kapselt Axios und implementiert Anforderungsaufrufe
Auf keinen Fall. Es stellt sich heraus, dass es L...
Analyse der Implementierung der Nginx Rush-Kaufstrombegrenzungskonfiguration
Aus geschäftlichen Gründen kommt es häufig zu Eil...
IDEA verwendet das Docker-Plugin (Tutorial für Anfänger)
Inhaltsverzeichnis veranschaulichen 1. Aktivieren...
Detaillierte Anweisungen zur Installation von SuPHP auf CentOS 7.2
Standardmäßig wird PHP unter CentOS 7 als Apache ...
Detaillierte Erläuterung der Idee, mit CSS-Animation den Punkteeffekt zu erzielen
Im aktuellen Projekt müssen wir einen Effekt zum ...