Cómo reproducir un sonido al hacer clic o al pasar el mouse

Usa HTML dinámico para reproducir sonidos Una de las características de las aplicaciones informáticas es que hay comentarios cuando haces algo. El tipo más común de retroalimentación es el sonido.

Usa HTML dinámico para reproducir sonidos

Una de las características de las aplicaciones informáticas es que hay comentarios cuando haces algo. El tipo más común de retroalimentación es el sonido. La computadora hace clic cuando selecciona cosas, emite un pitido cuando hay errores y hace otros ruidos para alertarlo sobre situaciones. Pero las páginas web no tienen este tipo de comentarios. Esto los hace parecer aburridos o no responden.

Por suerte, es fácil cambiar eso. Usando atributos y sonidos HTML dinámicos, puede crear una página web que actúa más como una aplicación.

Agregue sonido cuando un cliente hace clic en algo

Este script agregará efectos de sonido cuando un cliente hace clic en algo usando el atributo y cuando un cliente pasa sobre algo usando el atributo. Asegúrese de probarlos en diferentes navegadores, ya que no todos los navegadores web manejan el mouseover y los atributos de clic en elementos que no sean enlaces.

Coloque el siguiente script en el HEAD de su documento HTML:

 
función playSound (archivo de sonido) {
document.getElementById ("dummy"). innerHTML = " + soundfile +" \ "hidden = \" true \ "autostart = \" true \ "
loop = \" false \ "/>";
}

Coloque el sonido en un espacio vacío

El JavaScript coloca un elemento EMBED dentro de un elemento SPAN vacío cuando se inicia el script. Por lo tanto, debe agregar la siguiente etiqueta SPAN en algún lugar dentro del CUERPO de su página HTML, preferiblemente cerca de la parte superior del documento:

 

Llamar a la secuencia de comandos con un atributo

Lo último que necesita agregar es un elemento que desea generar el sonido al hacer clic o al pasar el mouse. Llame al script con uno de estos atributos. Reemplace UrlToSoundFile con la URL completa del archivo de sonido que desea que reproduzca:

  onclick = "playSound ('UrlToSoundFile');" > Haga clic aquí para escuchar un sonido  

onmouseover = "playSound ('UrlToSoundFile');" > Pase el mouse sobre este texto para escuchar un sonido


Aquí está todo el documento HTML, reproduciendo el sonido de un bluejay. El archivo de sonido se almacena en el mismo directorio que la página HTML:

 



Ejemplo de cómo reproducir un sonido al hacer clic o al pasar el mouse

función playSound (archivo de sonido) {
document.getElementById ("dummy"). innerHTML =
"";
}




onclick =" playSound ('zbluejay.wav'); "> Haga clic aquí para escuchar a un pájaro cantar


onmouseover =" playSound ('zbluejay.wav'); "> O puede colocar el mouse sobre este párrafo para escuchar el mismo sonido de pájaro.




Rate article
labsfabs.com
Add a comment