URGENTE!! Ayuda con mapa de imágenes

lbazer · #1 (**permalink**) 13/04/2009, 12:30

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

bookmaster · #2 (**permalink**) 13/04/2009, 13:08

Yo haria lo siguiente:

Código html:

Ver original<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"><head>
 
 
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"><title>Documento sin título</title>
 
<style type="text/css">
.estilo1 {
        border:2px #003333 solid;
}
</style></head><body>
<map name="mapa1">
<area alt="MSN" shape="rect" coords="-3,99,98,203" href="http://www.msn.com/"
onmouseover="Imagen.src='mapadeimagenes_files/buscamsn.jpg'"
onmouseout="Imagen.src='mapadeimagenes_files/buscamsn.jpg'">
 
<area alt="AOL" shape="rect" coords="96,99,201,203" href="http://www.aol.com/"
onmouseover="Imagen.src='mapadeimagenes_files/buscaaol.jpg'"
onmouseout="Imagen.src='mapadeimagenes_files/buscamsn.jpg'">
 
<area alt="Yahoo" shape="rect" coords="96,0,202,101" href="http://www.yahoo.com/"
onmouseover="Imagen.src='mapadeimagenes_files/buscayahoo.jpg'"
onmouseout="Imagen.src='mapadeimagenes_files/buscamsn.jpg'">
 
<area alt="Google" shape="rect" coords="0,0,98,101" href="http://www.google.com/"
onmouseover="Imagen.src='mapadeimagenes_files/buscagoogle.jpg'"
onmouseout="Imagen.src='mapadeimagenes_files/buscamsn.jpg'">
  
</map>
<img id="Imagen" src="mapadeimagenes_files/busca.jpg" class="estilo1" usemap="#mapa1" height="200" width="200">
 
</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

lbazer · #3 (**permalink**) 13/04/2009, 15:03

Honestamente no veo nada raro, ni en firefox ni ie
si alguien puede ayudar le agradezco. Saludos

bookmaster · #4 (**permalink**) 13/04/2009, 15:26

¿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.