Hola.
tengo un mapa de imágenes y quiero que al pasar por un determinado área me cambie la imagen de fondo.
Con lo que tengo ahora me marca el siguiente error:
bad value `fixed` for CSS property position
Domado: HTMLAreaElement is not tamed; its specific properties/methods will not be available on <area>.
Domado: HTMLMapElement is not tamed; its specific properties/methods will not be available on <map>.
Rejecting <img>.setAttribute( src , https://sites.google.com/prueba/img1.png?attredirects=0 )
mi codigo es:
area {cursor:pointer;}
</style>
<div id="container" style="margin-top: 17px;">
<img id="imgMapa" src="https://sites.google.com/prueba/img.png?attredirects=0" alt="Swatches" usemap="#map" />
<map name="map">
<area shape="poly" coords="112,101,191,102,210,111,246,106,247,113,21 8,168,175,166,160,157,144,151,128,147,117,137,110, 119" target="_self" id="m1" />
<area shape="poly" coords="244,399,253,397,244,390,253,376,259,359,27 3,347,282,337,274,326,281,315,272,291,266,278,252, 267,237,267,234,258,241,252,243,247,244,235,253,23 8,258,235,261,228,266,235,277,233,281,231,280,222, 262,211,238,205,226,212,223,220,224,230,214,244,21 5,257,222,270,227,283,240,294,239,316,235,343,230, 368,228,392,243,400,240,393,241,393,237,390" href="open" target="_self" id="m2"/>
<area shape="poly" coords="387,115,427,119,411,140,380,139" href="big" target="_self" id="m3"/>
<area shape="poly" coords="472,118,520,122,519,139,482,140,468,140" href="big" target="_self" id="m4"/>
<area shape="poly" coords="128,148,160,157,172,164,174,166,175,180,18 4,187,193,180,201,178,200,187,186,197,172,195,156, 185,144,172,133,162,128,148" href="big" target="_self" id="m5"/>
</map>
</div>
<script language="javascript" type="text/javascript">
$(function() {
$("area").mouseover(function(event) {
$("#capaHelp"+this.id).slideToggle();
$("#imgMapa").attr("src","https://sites.google.com/prueba/img1.png?attredirects=0");
});
$("area").mouseout(function(event) {
$("#capaHelp"+this.id).slideToggle();
$("#imgMapa").attr("src","https://sites.google.com/prueba/img1.png?attredirects=0");
});
});
</script>