Foros del Web » Creando para Internet » Diseño web »

URGENTE!! Ayuda con mapa de imágenes

Estas en el tema de URGENTE!! Ayuda con mapa de imágenes en el foro de Diseño web en Foros del Web. Hola a todos tengo este mapa de imagenes : http://www.lbprueba.webspacemania.co...eimagenes.html Y necesito que al pasar el mouse sobre alguna de las 4 areas que cree ...
  #1 (permalink)  
Antiguo 13/04/2009, 13:30
 
Fecha de Ingreso: febrero-2009
Mensajes: 159
Antigüedad: 8 años, 10 meses
Puntos: 1
URGENTE!! Ayuda con mapa de imágenes

Hola a todos tengo este mapa de imagenes :
http://www.lbprueba.webspacemania.co...eimagenes.html
Y necesito que al pasar el mouse sobre alguna de las 4 areas que cree cabie la imágen de esa área. He buscado soluciones en el foro y no la encontre o lo que he encontrado me ha parecido sumamente complicado. Tengo entendido que dentro del área debes incluir la propiedad onmouseover=ww_swapimage, pero la verdad que no estoy seguro. Si alguien puede ayudarme con este con no puedo solucionar le agradezco enormemente. Espero sus noticas.
Saludos a todos
  #2 (permalink)  
Antiguo 13/04/2009, 14:08
Avatar de bookmaster  
Fecha de Ingreso: febrero-2002
Ubicación: Toledo
Mensajes: 976
Antigüedad: 15 años, 10 meses
Puntos: 67
Respuesta: URGENTE!! Ayuda con mapa de imágenes

Yo haria lo siguiente:

Código html:
Ver original
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml"><head>
  3.  
  4.  
  5. <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"><title>Documento sin título</title>
  6.  
  7. <style type="text/css">
  8. .estilo1 {
  9.         border:2px #003333 solid;
  10. }
  11. <map name="mapa1">
  12. <area alt="MSN" shape="rect" coords="-3,99,98,203" href="http://www.msn.com/"
  13. onmouseover="Imagen.src='mapadeimagenes_files/buscamsn.jpg'"
  14. onmouseout="Imagen.src='mapadeimagenes_files/buscamsn.jpg'">
  15.  
  16. <area alt="AOL" shape="rect" coords="96,99,201,203" href="http://www.aol.com/"
  17. onmouseover="Imagen.src='mapadeimagenes_files/buscaaol.jpg'"
  18. onmouseout="Imagen.src='mapadeimagenes_files/buscamsn.jpg'">
  19.  
  20. <area alt="Yahoo" shape="rect" coords="96,0,202,101" href="http://www.yahoo.com/"
  21. onmouseover="Imagen.src='mapadeimagenes_files/buscayahoo.jpg'"
  22. onmouseout="Imagen.src='mapadeimagenes_files/buscamsn.jpg'">
  23.  
  24. <area alt="Google" shape="rect" coords="0,0,98,101" href="http://www.google.com/"
  25. onmouseover="Imagen.src='mapadeimagenes_files/buscagoogle.jpg'"
  26. onmouseout="Imagen.src='mapadeimagenes_files/buscamsn.jpg'">
  27.  
  28. </map>
  29. <img id="Imagen" src="mapadeimagenes_files/busca.jpg" class="estilo1" usemap="#mapa1" height="200" width="200">
  30.  
  31. </body></html>

Crearía una imagen con cada zona marcada y con onmouseover y onmouseout me encargaría de cambiarlas.

Te dejo el enlace para que lo veas funcionando:
http://fdw.lohacemosweb.net/mapadeimagenes.php
__________________
Decir si te a funcionado la respuesta es ¡GRATIS!. Por favor indicarlo.
http://www.lohacemosweb.net
http://tutoriales.lohacemosweb.net
  #3 (permalink)  
Antiguo 13/04/2009, 16:03
 
Fecha de Ingreso: febrero-2009
Mensajes: 159
Antigüedad: 8 años, 10 meses
Puntos: 1
Respuesta: URGENTE!! Ayuda con mapa de imágenes

Honestamente no veo nada raro, ni en firefox ni ie
si alguien puede ayudar le agradezco. Saludos
  #4 (permalink)  
Antiguo 13/04/2009, 16:26
Avatar de bookmaster  
Fecha de Ingreso: febrero-2002
Ubicación: Toledo
Mensajes: 976
Antigüedad: 15 años, 10 meses
Puntos: 67
Respuesta: URGENTE!! Ayuda con mapa de imágenes

¿No ves el cambio de imágenes?
¿Ni la parte del onmouseover y onmouseout, que lo puse en otras lineas para que se vea bien?

Te puse un ejemplo del código y explicándote lo que cambiaba.

Es cierto que la página es un ejemplo y que tu tienes que adaptar las imágenes a lo que necesites, y yo solo te he puesto la manera de hacerlo.
__________________
Decir si te a funcionado la respuesta es ¡GRATIS!. Por favor indicarlo.
http://www.lohacemosweb.net
http://tutoriales.lohacemosweb.net

Última edición por bookmaster; 13/04/2009 a las 16:39
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 02:19.