CSS - Problema con area shape en firefox

Problema con area shape en firefox

Publicado por marcos (1 intervención) el 31/05/2011 10:56:28

Buenos días:

Tengo un area shape asociada a una imagen y me funciona bien en IE7, pero en Firefox me devuelve el siguiente error:

El atributo "coords" de la etiqueta <area shape="rect"> no está en el formato "izda, arriba, dcha, abajo".

El código.

<img src='img/provincias.png' border='0' alt='' usemap='#mapa_clave_Map'>
<map name='mapa_clave_Map'>

<AREA SHAPE="poly" ALT="ALAVA" COORDS="223,33, 223,34, 224,36, 227,42, 226,42, 224,42, 222,42, 222,45, 223,48, 234,59, 237,57, 239,60, 245,62, 248,60, 246,55, 250,54, 252,48, 251,43, 249,41, 242,41, 244,36, 242,36, 239,38, 234,36, 229,30, 227,34" HREF="index.php?cp=01000&prov=ALAVA" >

<AREA SHAPE="poly" ALT="ALBACETE" COORDS="239,204, 235,206, 234,220, 240,227, 237,232, 237,239, 243,239, 244,243, 246,244, 250,250, 245,256, 251,260, 263,247, 267,249, 274,244, 277,247, 282,243, 282,235, 288,228, 293,227, 298,231, 300,231, 300,225, 300,220, 299,218, 291,218, 289,213, 292,203, 284,201, 280,197, 270,204,262,204, 259,205, 250,204, 246,202" HREF="index.php?cp=02002&prov=ALBACETE">

</map>

¿Alguna idea? Gracias

Valora esta pregunta

Me gusta: Está pregunta es útil y esta clara

No me gusta: Está pregunta no esta clara o no es útil

Responder

Solucion - Problema con area shape en firefox

Publicado por Calevano (1 intervención) el 03/01/2014 16:37:31

Estuve trabajando tambien con <area> y un tutorial de que encontré para poder no reinventar la rueda, pero el problema era que me corría en los demás navegadores pero no en FIREFOX, así que de tanto probar y probar encontré la solución y aqui te la muestro

<div class="content">

            <!-- El que activa -->

            <img src="images/mapamundi-prueba.jpg" width="942" height="401" border="0" usemap="#mimapa" id="mapa"/>

            <div id="areamap">

                <map name="mimapa" id="mapa">

                    <area shape="poly" coords="174,251,193,276,213,291,215,274,201,262,202,249,209,244,203,242,193,238,180,245" href="javascript:void(0)" title="Perú" alt="Mapa-1" class="activator" id="activator1"/>

                    <area shape="poly" coords="180,232,207,243,214,229,214,214,200,208,203,199,186,210" href="javascript:void(0)" title="Colombia" alt="Mapa-2" class="activator" id="activator2"/>

                    <area shape="poly" coords="91,88,178,89,181,108,236,96,186,140,183,158,165,143,128,156,84,142,66,120,83,89" href="javascript:void(0)" title="EE.UU"  alt="Mapa-3"class="activator" id="activator3"/>

                </map>

            </div>

        </div>

Aqui te dejo el link del tutorial para poder hacer un Popup con CSS y jquery.. muy bueno
http://tympanus.net/codrops/?p=961

Valora esta respuesta

Me gusta: Está respuesta es útil y esta clara

No me gusta: Está respuesta no esta clara o no es útil

Comentar