Imprimir Página - reproducir sonido al pasar sobre una imagen

Título: reproducir sonido al pasar sobre una imagen
Publicado por: motocros_elche en 27 Febrero 2010, 20:26 pm

Buenas quería saber como se hace eso de que cuando alguien pase el puntero del ratón por encima de la imagen se escuche un sonido y al quitarlo para de escucharse ese sonido

como en las webs que tienen publicidad que sale por ejemplo lo del msn que cuando pasas el puntero se oye como cuando te hablan...

Un saludo!

Título: Re: reproducir sonido al pasar sobre una imagen
Publicado por: Nakp en 27 Febrero 2010, 20:31 pm

flash :-\

Título: Re: reproducir sonido al pasar sobre una imagen
Publicado por: motocros_elche en 27 Febrero 2010, 20:32 pm

Cita de: Nakp en 27 Febrero 2010, 20:31 pm

flash :-\

mmm ok voy a ver si aparece la opción de en dream weaver de que se reproduzcan al pasar el puntero sobre el si sale entonces es asi de facil? :S

Título: Re: reproducir sonido al pasar sobre una imagen
Publicado por: Nakp en 28 Febrero 2010, 06:27 am

no :xD asi de facil no... talvez con algo de javascript podrias lograrlo y el evento onhover, pero en hotmail y los de los emoticonos lo hacen con flash :P

Título: Re: reproducir sonido al pasar sobre una imagen
Publicado por: Gonzalo Leonardo en 25 Junio 2010, 07:42 am

Huy huy huy...recién me topé con el mismo problema. Mi idea es que al pasar por arriba de una imagen, un trozo de texto o lo que fuese, se pueda reproducir un audio.

Buscando información encontré este código, el cual NO FUNCIONO:

Código

<html>
<head>
<script>
function Reproducir(){
document.all.sound.src = "archivo.wav"}
function Parar(){
document.all.sound.src = ""}
</script>
</head>
<body>
En el Body:
<bgsound id="sound">
<a href="pagina_que_sea" onmouseover="Reproducir()" onmouseout="Parar()">Enlace 1</a>
<a href="pagina_que_sea" onmouseover="Reproducir()" onmouseout="Parar()">Enlace 2</a>
</body>
</html>

Si alguien lo hace funcionar o se le ocurre una idea mas simple, avise. Mi idea no es utilizar flash ni nada de eso, ya que no quiero una web pesadita.

Título: Re: reproducir sonido al pasar sobre una imagen
Publicado por: Kasi en 25 Junio 2010, 18:54 pm

Creo que eso solo funcionaría en Internet Explorer, mas que nada por que el document.all solo lo reconoce IE, lo cual no es buena alternativa por que el resto de gente que utilice otros navegadores no podrá reproducir el sonido.

Un saludo

Título: Re: reproducir sonido al pasar sobre una imagen
Publicado por: Gonzalo Leonardo en 25 Junio 2010, 20:20 pm

La verdad es que lo he probado con Mozilla y con IE pero no funcionó con ninguno de los dos. Si alguien sabe al menos hacerlo funcionar con uno solo, me basta. Este es el código que acabo de probar.

Código

<html>
<head>
<script>
function Reproducir(){
document.all.sound.src = "index1.wav"}
function Parar(){
document.all.sound.src = ""}
</script>
</head>
<body bgsound id="sound">
<a href="#" onmouseover="Reproducir()" onmouseout="Parar()">Enlace 1</a>
<a href="#" onmouseover="Reproducir()" onmouseout="Parar()">Enlace 2</a>
</body>
</html>

Probé con todas estas variantes:
- Con un archivo de extensión *.wav y *.mp3
- Poniendole una página a href
- Poniendo el archivo en la carpeta sound

Espero que alguien me pueda ayudar a concluir con mi proyecto que recien acaba de empezar. Es para hacer una página para invidentes.

Título: Re: reproducir sonido al pasar sobre una imagen
Publicado por: motocros_elche en 25 Junio 2010, 21:43 pm

Cita de: Gonzalo Leonardo en 25 Junio 2010, 20:20 pm

Código

<html>
<head>
<script>
function Reproducir(){
document.all.sound.src = "index1.wav"}
function Parar(){
document.all.sound.src = ""}
</script>
</head>
<body bgsound id="sound">
<a href="#" onmouseover="Reproducir()" onmouseout="Parar()">Enlace 1</a>
<a href="#" onmouseover="Reproducir()" onmouseout="Parar()">Enlace 2</a>
</body>
</html>

mmm donde pine enlace uno y enlace dos no deberia de ir algun link del sonido?

prueba a subir la cancion por ejemplo a /root que se llame por ejemplo prueba.mp3 y copias el de la canción y ese link lo pones donde pone index.wav por ejemplo en donde dice index.wav remplazalo por www.tuweb.com/prueba.mp3

prueba y me dices si te funciona modifika solo eso de infex.wav por lo que te he dicho con su link correspondiente...

creo que me he explicado bien... xD

Título: Re: reproducir sonido al pasar sobre una imagen
Publicado por: raul338 en 25 Junio 2010, 21:49 pm

Cita de: Gonzalo Leonardo en 25 Junio 2010, 20:20 pm

Código

<html>
<head>
<script>
function Reproducir(){
document.all.sound.src = "index1.wav"}
function Parar(){
document.all.sound.src = ""}
</script>
</head>
<body bgsound id="sound">
<a href="#" onmouseover="Reproducir()" onmouseout="Parar()">Enlace 1</a>
<a href="#" onmouseover="Reproducir()" onmouseout="Parar()">Enlace 2</a>
</body>
</html>

Deberia funcionar en IE, pero no se reproduciria hasta que baje el sonido (ahora, si no funciona en local,me cagaste xD)

Título: Re: reproducir sonido al pasar sobre una imagen
Publicado por: motocros_elche en 25 Junio 2010, 22:09 pm

tambien podria probar a usar flash... no creeis?
es muy facil
por ejemplo editas la cancion la pasas a flash yo te reomiendo el formatfactory que es un muy buen conversor y gratuito y de esa manera quizas te compliques menos y termines antes...
ya de paso usas algun diseño en vez de que sea solo audio si eso...

solo doy posibles ideas por si acaso... xD

Título: Re: reproducir sonido al pasar sobre una imagen
Publicado por: :ohk<any> en 26 Junio 2010, 15:27 pm

Cita de: Nakp en 27 Febrero 2010, 20:31 pm

flash :-\

Título: Re: reproducir sonido al pasar sobre una imagen
Publicado por: Nakp en 26 Junio 2010, 17:52 pm

el tema es de febrero :¬¬ pero lo he dejado seguir porque me ha picado saber si alguien propondría html5 que, desde hace unos meses es mas real que una ilusion como entonces :P todavia es un poco dificil por el soporte a distintos formatos :P

la idea es embeder un audio done sea, con preload=true y a tu elemento le agregas el evento onmouseover -> audiodefondo.

esto es con video :P pero te servira de guia

http://ajaxian.com/archives/html5-media-support-video-and-audio-tags-and-scriptability/

Título: Re: reproducir sonido al pasar sobre una imagen
Publicado por: 16BITBoy en 26 Junio 2010, 19:39 pm

Cierto lo de HTML5. Yo estuve jugando un poco con ello, pero no tiene historia por ahora, lo unico que no se ponen de acuerdo los navegadores, o el estandar aun sigue en borrador, en cuanto a los formatos soportados.

Código

<html>
  <head>
    <title>Audio Player</title>
  <script>
  </script>
  </head>
  <body>
    <audio id="audioTestElem" src="13B.T.mp3" autobuffer >
    </audio>
    <div id="pp" style="width: 10px; height: 10px; background-color: #FF0000" onclick="audioTestElem.play()"></div>
    <div id="pp" style="width: 10px; height: 10px; background-color: #FF00FF" onclick="audioTestElem.pause()"></div>
  </body>
</html>

Esto con mp3 solo funciona en chrome hasta donde he probado, pero me imagino que con wav deberia ir en todos, y para lo que quiere seia sustituir el "onclick" por onmouseover.

Foro de elhacker.net

Programación => Desarrollo Web => Mensaje iniciado por: motocros_elche en 27 Febrero 2010, 20:26 pm