È possibile rilevare se il browser supporta Html5 Audio tramite Modernizr? Se sì, come è fatto? Se no ci sono dei lavori in giro? Ci sono poche risorse su Google che spiegano questo, quindi qualsiasi aiuto sarebbe apprezzato.Rilevamento del supporto audio html5 con Modernizr
risposta
Sì, tramite modernizr.audio. Supporta un numero di formati audio (attualmente ogg, mp3, m4a & wmv). Esempio:
var audio = new Audio();
audio.src = Modernizr.audio.ogg ? 'background.ogg' :
Modernizr.audio.mp3 ? 'background.mp3' :
'background.m4a';
audio.play();
Maggiori informazioni nel documentation.
Sì, ho provato questo: e non sembra funzionare .. Darò uno scatto, grazie uomo –
come faccio a eseguire le cose all'interno dell'istruzione if? –
@Michael 'if (Modernizr.audio) {..}' funziona davvero. – alexn
Sì, Modernizr rileva supporto audio, secondo the documentation (che è un link), che comprende anche un esempio di codice (copiato sotto):
var audio = new Audio();
audio.src = Modernizr.audio.ogg ? 'background.ogg' :
Modernizr.audio.mp3 ? 'background.mp3' :
'background.m4a';
audio.play();
Sì. http://www.modernizr.com/docs/#installing A metà strada.
ho trovato questo codice e ha funzionato bene per me:
<!DOCTYPE html>
<html>
<head>
<title>Play Audio</title>
<script src="script/jquery-1.6.2.min.js" type="text/javascript"></script>
<script src="script/modernizr-latest.js" type="text/javascript"></script>
<script type="text/javascript">
var currentFile = "";
function playAudio() {
var oAudio = document.getElementById('myaudio');
// See if we already loaded this audio file.
if ($("#audiofile").val() !== currentFile) {
oAudio.src = $("#audiofile").val();
currentFile = $("#audiofile").val();
}
var test = $("#myaudio");
test.src = $("#audiofile").val();
oAudio.play();
}
$(function() {
if (Modernizr.audio) {
if (Modernizr.audio.wav) {
$("#audiofile").val("sounds/sample.wav");
}
if (Modernizr.audio.mp3) {
$("#audiofile").val("sounds/sample.mp3");
}
}
else {
$("#HTML5Audio").hide();
$("#OldSound").html('<embed src="sounds/sample.wav" autostart=false width=1 height=1 id="LegacySound" enablejavascript="true" >');
}
});
</script>
</head>
<body>
<div style="text-align: center;">
<h1>Click to Play Sound<br /></h1>
<div id="HTML5Audio">
<input id="audiofile" type="text" value="" style="display: none;"/><br />
<button id="play" onclick="playAudio();">
Play
</button>
</div>
<audio id="myaudio">
<script>
function LegacyPlaySound(soundobj) {
var thissound=document.getElementById(soundobj);
thissound.Play();
}
</script>
<span id="OldSound"></span>
<input type="button" value="Play Sound" onClick="LegacyPlaySound('LegacySound')">
</audio>
Basta aggiungere l'audio con il nome giusto nella cartella e aggiungere i file modernizzatore con il Jquery roba e il gioco è fatto.
Attribuzione: http://www.misfitgeek.com/2011/08/play-sound-in-html5-and-cross -browser-support-con-backward-compatibilità / – Trae
- 1. Rilevamento del supporto Drag & Drop HTML5 in javascript
- 2. Riproduzione audio con HTML5
- 3. Rilevamento del supporto del mouse
- 4. Rilevamento errore file audio HTML5 non trovato errore
- 5. Librerie audio HTML5
- 6. Rilevamento del supporto di caratteri Unicode con JavaScript
- 7. html5 audio livestreaming
- 8. API audio html5 completa
- 9. Visualizzatore audio HTML5?
- 10. Il supporto del tag audio HTML5 supporta gli mp3 da un altro dominio?
- 11. audio in streaming con html5 `<audio>` tag
- 12. Ingresso audio tramite HTML5?
- 13. Registrazione audio HTML5
- 14. HTML5 Audio Looping
- 15. Riproduzione di flussi audio protetti con audio HTML5
- 16. Ricevi array di byte audio con l'API audio HTML5?
- 17. cambia sorgente audio con tag audio jQuery e HTML5
- 18. MEDIA_ERR_SRC_NOT_SUPPORTED HTML5 guai audio
- 19. HTML5 Audio - Barra di avanzamento
- 20. HTML5 Bluetooth e audio
- 21. HTML5 Registrazione audio con basso kbps
- 22. È possibile registrare audio con HTML5?
- 23. Supporto HTML5 Doctype
- 24. Problemi di rilevamento delle funzioni segnaposto HTML5
- 25. Supporto di musica MIDI in HTML5
- 26. Rilevamento del supporto di movimento/orientamento del dispositivo?
- 27. Modernizr vs HTML shiv
- 28. Rilevamento silenzio acquisizione audio Android
- 29. Modernizr con cssSandpaper?
- 30. Va bene implementare Modernizr con Twitter Bootstrap?
Stavo per pubblicare una terza risposta "leggi i documenti" ma gli altri due sono stati pubblicati pochi secondi prima. La documentazione dovrebbe essere la tua prima risorsa, non Stack Overflow ... –