Ver Mensaje Individual
  #1 (permalink)  
Antiguo 04/03/2015, 10:36
Avatar de Hakueiryu
Hakueiryu
 
Fecha de Ingreso: febrero-2015
Mensajes: 33
Antigüedad: 9 años, 1 mes
Puntos: 0
Pregunta Problema con mapa de imagenes

Hola que tal, tengo un pequeño problema con un mapa de imagenes, ya he leido varios de los post en donde caricatos ayuda con su metodo, pero ese no me ha servido, lo que busco es lograr ese mismo efecto en este mapa http://pruebamapas.esy.es/mapa.html pasar el mouse por cualquiera de las areas y que se ilumine o que se superponga una imagen con un color gris para que se diferencie.

He leido que se puede trabajar con javascript usando las funciones onMouseOn y onMouseOut, pero la verdad es que no se como defirlas me pueden ayudar con esto por favor

Lo estoy trabajando de esta forma:
Código HTML:
<center><img src="mapa4.PNG" width="500px" height="500px" usemap="#Map" alt="texto alternativo  "></center>
<map name="Map">
  <area shape="poly" coords="160,68,151,73,143,70,137,73,130,73,125,75,121,80,118,85,112,90,112,95,114,97,114,103,113,107,111,110,108,112,103,115,99,115,96,119,96,123,96,129,93,132,94,136,97,139,100,143,103,147,105,150,109,153,111,155,114,158,117,161,119,164,122,168,122,173,124,179,126,182,126,187,128,189,129,192,132,194,135,198,142,199,150,199,153,196,158,196,163,190,168,185,173,180,175,173,172,166,169,159,171,159,176,158,177,155,178,151,179,145,173,137,171,134,172,130,172,125,172,122,170,119,162,113,165,106,165,95,159,87,158,78,156,75" href="http://www.forosdelweb.com/f4/listado_proyecto_inversion/listado_garcia_hevia_9.php">
  <area shape="poly" coords="228,33,224,34,219,38,214,41,211,42,209,45,208,51,200,51,196,51,192,55,185,58,179,60,170,63,165,67,164,72,164,78,165,83,165,88,168,94,170,95,170,100,171,103,171,108,171,113,172,114,174,115,178,119,178,126,178,130,180,133,182,135,184,142,185,147,185,153,189,153,197,148,198,145,207,143,211,142,214,144,217,145,217,138,220,134,226,130,232,127,236,123,239,120,241,116,241,109,237,100,237,93,238,85,232,78,227,68,227,62,230,55,230,47,228,40,228,36" href="http://www.forosdelweb.com/f4/listado_proyecto_inversion/listado_panamericano_19.php">
  <area shape="poly" coords="238,46,240,53,241,57,241,62,239,64,239,69,241,74,243,79,247,81,248,87,246,94,246,99,248,103,253,108,253,112,253,117,252,122,254,126,257,128,261,132,265,135,267,129,270,125,276,125,278,125,282,125,286,126,285,121,283,115,286,110,291,104,296,100,298,93,297,86,293,78,289,69,284,63,276,55,269,53,264,51,259,48,253,49,243,49" href="http://www.forosdelweb.com/f4/listado_proyecto_inversion/listado_samuel_dario_22.php">
  <area shape="poly" coords="100,155,106,160,111,163,113,166,114,174,116,178,118,185,120,189,121,194,123,200,130,203,135,205,140,207,146,208,151,209,153,213,155,218,156,223,159,228,165,231,166,238,163,245,161,251,153,256,144,255,137,250,129,258,126,253,119,254,111,250,111,240,111,231,106,225,106,219,106,207,109,209,109,201,109,194,103,185,98,176,100,167" href="http://www.forosdelweb.com/f4/listado_proyecto_inversion/listado_ayacucho_3.php">
  <area shape="poly" coords="166,218,161,212,159,206,160,200,165,196,170,193,174,189,178,184,183,180,187,180,189,185,185,187,182,193,178,198,177,203,174,209,171,213" href="http://www.forosdelweb.com/f4/listado_proyecto_inversion/listado_antonio_romulo_2.php">
  <area shape="poly" coords="182,172,178,165,184,159,190,162,197,156,208,149,205,150,212,152,219,153,223,158,225,153,226,146,229,150,231,158,233,163,238,165,241,172,239,177,237,181,235,183,230,187,224,188,214,193,204,189,201,186,196,180,195,175,191,170,187,170" href="http://www.forosdelweb.com/f4/listado_proyecto_inversion/listado_san_judas_24.php">
  <area shape="poly" coords="227,141,231,136,236,132,242,131,248,136,251,136,257,139,260,144,261,150,263,155,264,162,268,167,262,171,261,177,255,182,255,188,253,195,253,202,255,206,255,212,253,219,252,226,250,231,247,238,247,244,240,244,234,247,231,250,225,248,218,246,221,236,220,229,220,223,217,219,216,214,220,210,219,203,218,194,222,195,228,192,236,190,241,185,245,179,246,173,247,166,245,160,241,157,236,154,233,145" href="http://www.forosdelweb.com/f4/listado_proyecto_inversion/listado_jauregui_12.php">
  <area shape="poly" coords="195,192,188,194,189,200,188,204,187,207,182,211,180,217,174,222,173,226,178,226,183,227,188,224,194,224,198,230,205,223,205,218,212,215,213,200,206,199,199,195" href="http://www.forosdelweb.com/f4/listado_proyecto_inversion/listado_seboruco_25.php">
  <area shape="poly" coords="184,236,189,233,197,233,201,236,205,235,206,229,211,225,216,227,218,234,218,240,216,245,215,249,213,255,210,263,205,267,203,274,195,279,184,279,181,274,184,269,179,263,182,263,184,253,185,245,184,238" href="http://www.forosdelweb.com/f4/listado_proyecto_inversion/listado_jose_maria_13.php">
  <area shape="poly" coords="173,238,180,240,180,246,178,253,174,257,172,264,173,270,171,273,173,275,158,275,152,274,144,272,139,267,136,259,142,261,149,261,156,263,160,259,164,256,168,250,170,244" href="http://www.forosdelweb.com/f4/listado_proyecto_inversion/listado_michelena_18.php">
  <area shape="poly" coords="109,257,118,258,121,260,122,267,128,269,134,270,134,274,138,281,145,285,153,283,160,283,164,283,160,290,154,295,145,296,135,295,127,298,120,295,115,290,108,286,105,279,105,271,109,266" href="http://www.forosdelweb.com/f4/listado_proyecto_inversion/listado_lobatera_17.php">
  <area shape="poly" coords="89,252,94,251,98,253,102,259,99,265,96,271,93,279,99,286,93,288,90,298,85,297,77,298,75,290,76,283,71,281,66,277,71,273,80,272,83,267,88,263,90,258" href="http://www.forosdelweb.com/f4/listado_proyecto_inversion/listado_pedro_maria_20.php">
  <area shape="poly" coords="274,132,280,132,284,133,285,136,286,141,289,146,285,149,280,153,277,151,276,154,274,162,271,159,269,152,269,145,269,142,272,138" href="http://www.forosdelweb.com/f4/listado_proyecto_inversion/listado_simon_rodriguez_26.php">
  <area shape="poly" coords="116,301,109,295,101,296,94,298,95,305,96,313,99,316,103,319,106,319,107,322,109,326,110,331,109,336,113,337,115,344,117,344,121,348,125,353,130,360,132,356,131,350,129,345,128,338,122,331,121,327,120,322,117,315,116,306" href="http://www.forosdelweb.com/f4/listado_proyecto_inversion/listado_libertad_15.php">
  <area shape="poly" coords="135,319,140,324,144,327,146,322,139,319" href="http://www.forosdelweb.com/f4/listado_proyecto_inversion/listado_cardenas_5.php">
</map>