¿Sónido a un Menú CSS?

Iniciado por TheEGG 89, 26 Septiembre 2012, 05:48 AM

0 Miembros y 1 Visitante están viendo este tema.

TheEGG 89

La pregunta es bien sencilla (espero que su respuesta también :P )
¿le puedo agregar un sonido a un menú desplegable hecho con CSS?, es decir: al pasar el mouse por encima :P

Es lo que me falta para finalizar mi website!!

:-D

jdc

Quizás con html5, css3 y un poquito de javascript

#!drvy

Poner sonido en una web no es tan facil como pinta.
Tienes un montón de tags que lo hacen... <source>, <audio>, <embed>, <object>... pero los navegadores tienen sus propios codecs y cada uno hace lo que le de la gana....

Un ejemplo:

Código (html4strict) [Seleccionar]
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Prueba</title>
<script type="text/javascript">
function hsonido(){
  // Obtenemos el objeto mediante Id.
  var elementoSonido=document.getElementById('sonido');
  // Pausamos no tiene stop -.-
  elementoSonido.pause();
  // Ponemos desde el principio
  elementoSonido.currentTime = 0;
  // Iniciamos
  elementoSonido.play();
}
</script>
</head>
<body>
  <!-- Elemento de audio con display:none; para que no se muestre para nada. -->
  <audio style="display:none;"  id="sonido" src="sonido.wav" preload="auto" autobuffer></audio>
  <!-- No creo que haya necesidad de explicarlo -->
  <a href="" onmouseover="hsonido();">Menu 1</a>
  <br />
  <a href="" onmouseover="hsonido();">Menu 2</a>
</body>
</html>


PD: El tag audio es puro HTML5... así que olvídate de que funcione con IE7 o IE8 sin complementos ni js adicional.
PD2: Con jQuery seria mucho mas fácil =P

Saludos

EFEX

Es lo mismo en jquery, solo cambia la sintaxis de js.
GITHUB 

#!drvy

Lo decía por los plugins que se encargarían de mostrar las etiquetas adecuadas para las diferentes versiones de los navegadores =)


Saludos

TheEGG 89

La idea es que funcioens en Mozilla firefox y en Google Chrome.

Podría hacer la maquetación del sitio con Css y el menú (con sonidos) en JQuery??

#!drvy