Detección de soporte de audio html5 con Modernizr

¿Es posible detectar si el navegador tiene soporte de audio Html5 a través de Modernizr? ¿Si es así, cómo se hace? Si no hay alguna solución? Hay pocos recursos en Google explicando esto, por lo que cualquier ayuda sería apreciada.Detección de soporte de audio html5 con Modernizr

Fuente

2011-10-23 Michael Grigsby

Estaba a punto de publicar una tercera respuesta de "leer los documentos" pero las otras dos se publicaron segundos antes. La documentación debe ser su primer recurso, no Stack Overflow ... –

Sí, a través de modernizr.audio. Es compatible con una serie de formatos de audio (actualmente ogg, mp3, m4a & wmv). Ejemplo:

var audio = new Audio(); 
audio.src = Modernizr.audio.ogg ? 'background.ogg' : 
      Modernizr.audio.mp3 ? 'background.mp3' : 
            'background.m4a'; 
audio.play();

Más información en la documentation.

Fuente

2011-10-23 17:28:50 alexn

Sí, lo intenté: y parece que no funciona ... Voy a dar una oportunidad, gracias hombre –

¿cómo ejecuto cosas dentro de la instrucción if? –

@Michael 'if (Modernizr.audio) {..}' de hecho funciona. – alexn

Sí, Modernizr detecta soporte de audio, de acuerdo con the documentation (que es un enlace), que incluso incluye un ejemplo de código (copiado a continuación):

var audio = new Audio(); 
audio.src = Modernizr.audio.ogg ? 'background.ogg' : 
      Modernizr.audio.mp3 ? 'background.mp3' : 
            'background.m4a'; 
audio.play();

Fuente

2011-10-23 17:29:09

Sí. http://www.modernizr.com/docs/#installing A mitad de camino.

Fuente

2011-10-23 17:31:15

me encontré con este código y funcionó bien para mí:

<!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 con añadir el audio con el nombre correcto de la carpeta y añadir los archivos renovador con el Jquery cosas y listo.

Fuente

2012-09-19 16:37:22

Atribución: http://www.misfitgeek.com/2011/08/play-sound-in-html5-and-cross -browser-support-with-backward-compatability / – Trae

Detección de soporte de audio html5 con Modernizr

Respuesta

Cuestiones relacionadas