Socorro: Sonidos en cualquier parte

Que se puedan agregar sonidos a los enlaces quizás no es algo que me atraiga demasiado pero, por suerte, hasta ahora, era algo que estaba bastante limitado porque salvo Internet Explorer, el resto de los navegadores no poseían etiquetas para esto.

El problema, si es que uno ama algunos silencios, es que ahora, esas etiquetas comienza a estar diponibles y han dejado al viejo SOUND atrasado.

Tanto en IE9 como en Firefox, Chrome y Opera, la etiqueta en cuestión se llama AUDIO que es muy simple de usar aunque, como sigue siendo algo en desarrollo, las distintas empresas pelean para ver cual será el formato final que aceptarán y, por el momento no hay ninguno que sea universal y funcione en todos.

Formato	IE 9	Firefox	Opera	Chrome	Safari
Ogg Vorbis	NO	SI	SI	SI	NO
MP3	SI	NO	NO	SI	SI
Wav	NO	SI	SI	NO	SI

Así que si uno quiere que se escuche algo, por lo menos hay que incluir dos formatos de archivos:

<audio controls="controls">
  <source src="URL_archivo.mp3"></source>
  <source src="URL_archivo.ogg"></source>
  este navegador no puede reproducir audio nativo
</audio>

Eso escrito tal cual, mostraría el reproductor pero, tal como se muestra en css-tricks.com, basta eliminar el atributo controls para que podamos reproducir el audio sin necesidad de tener visible ese reproductor y por lo tanto, usando JavaScript podemos agregar eventos a una etiqueta cualquiera. La idea del artículo se basa en el uso de jQuery y por lo tanto, queda limitada a quienes la tengan agregada pero, nada impide quedarse con lo elemental, colocar un ID a las etiquetas AUDIO y agregar todas las que uno necesitaría:

<audio id="sonido1" preload="auto">
  .......
</audio>
<audio id="sonido2" preload="auto">
  .......
</audio>

Como el evento que usaré es onmouseover, lo agrego al enlace o a la etiqueta que quiera que "suene":

<a href="#" onmouseover="hacerruido(1);"> probar el sonido </a>

probar el sonido

Y sonará porque hay una función que ejecuta el sonido:

<script>
function hacerruido(num) {
  var audio = document.getElementById("sonido" + String(num));
  audio.play();
}
</script>

Sólo espero que no lo utilicen en demasía

probar el sonido