¿La gente todavía usa los viejos mapas de imagen HTML? Los que tienen:¿Todavía se utilizan los mapas de imágenes HTML?
<map name="test" id="test">
<area shape="poly" alt="" title="" coords=...
¿O hay una alternativa más nueva y mejor?
Sí, las personas aún usan mapas de imágenes. Una alternativa sería colocar elementos usando posicionamiento absoluto y CSS, pero eso no es necesariamente mejor. Tampoco le permite tener formas como en los mapas de imágenes
Ok, ¿entonces los mapas de imágenes html todavía son buenos? ¿Qué le parece agregar efectos de desplazamiento/desplazamiento? – ss888
Sí, también: http://www.svennerberg.com/examples/imagemap_rollover/ – JohnP
mi principal problema con los mapas de imágenes es que, a diferencia de las imágenes que asocian, no se adaptan al tamaño del navegador o de la pantalla. Espero que OP investigue los formatos SVG – Martin
Sí, los mapas de imágenes html son buenos, especialmente si desea que su área sea un polígono. Puede agregar efectos de rollover a su mapa también con javascript. Hay un buen tutorial y de demostración aquí:
http://www.tutorialized.com/view/tutorial/Image-Map-Rollover/3484
+1 - Si bien puede hacer mucho con CSS y el posicionamiento absoluto, los mapas de imágenes siguen siendo la única forma de detectar el vuelo estacionario en un área de polígono no rectangular. – Blazemonger
They are in the HTML5 specification, para que no quede obsoleta.
Aún se pueden usar libremente, sin duda todavía tienen su lugar en el desarrollo web. O podría decir que existen raras ocasiones donde puedes resolver mejor algo con un mapa de imágenes.
Una solución alternativa al uso de CSS o mapas de imágenes sería hacer uso de gráficos SVG incrustados en el HTML dom.
Un tutorial sobre cómo lograr efectos mouseover utilizando esta técnica se describe en este tutorial: http://www.petercollingridge.co.uk/data-visualisation/mouseover-effects-svgs
La conclusión clave ser que elementos SVG también desencadenan eventos DOM tradicionales incluyendo onmouseover y onmouseout.
+1 SVG es la mejor alternativa directa a los mapas de imagen, ya que la interacción puede ser con cualquier forma arbitraria. Se puede crear algo muy similar a los mapas de imágenes donde las coordenadas vectoriales cortan las imágenes de píxel de trama, [al dar a los elementos SVG un relleno de imagen] (http://stackoverflow.com/questions/3796025/fill-svg-path-element-with -a-background-image). Pero incluso entonces, los mapas de área pueden ser mejores en algunos casos (son más simples y no recortan la imagen, lo que podría ser deseable a veces). – user568458
Los mapas de imagen todavía se encuentran en las especificaciones HTML5, compatibles con todos los navegadores.
Pueden adaptarse a diseño de respuesta utilizando jQuery Mapas RWD imagen: https://github.com/stowball/jQuery-rwdImageMaps
Se detecta y automáticamente el tamaño de la imagen de los mapas de coordenadas.
También está disponible para los desarrolladores de Wordpress como plugin: http://wordpress.org/plugins/responsive-image-maps/
solución simple y eficaz.
Sí, todavía uso mapas de imágenes, sin embargo, mi último proyecto utilizó Raphaël. Fue bastante fácil hacer funcionar algo.
http://dmitrybaranovskiy.github.io/raphael/
De su sitio web:
Raphaël [ 'ræfeɪəl] utiliza la Recomendación W3C SVG y VML como base para la creación de gráficos . Esto significa que cada objeto gráfico que cree es también un objeto DOM, por lo que puede adjuntar controladores de eventos JavaScript o modificarlos más tarde. El objetivo de Raphaël es proporcionar un adaptador que sea compatible con y que sea compatible con el arte vectorial de dibujo entre navegadores.
Niza ejemplo sencillo mapa de imagen:
El enlace proporcionado anteriormente ya no funciona. – orschiro
No habría necesitado demasiado para arreglar el enlace usted mismo en lugar de gimiendo y votando :( –
Querido David, he eliminado el voto negativo. ¿Cómo quieres que arregle el enlace que simplemente está roto? Quitaría el 'http: // raphaeljs.com /' por completo y solo proporciona el ejemplo de Github. – orschiro
Aunque rara vez ver a utilizar en los sitios más modernos, que parecen ser utilizado por mis clientes en sus campañas de correo electrónico. Sin embargo, he notado, y confirmed que hay algunos problemas de escala con el sistema de coordenadas en los dispositivos móviles.
** Sé que este hilo es viejo, solo estaba haciendo una investigación adicional en este tema de una reciente campaña de correo electrónico y pensé que podría ayudar a alguien más en el futuro.
mapa de imagen es opción muy interesante en HTML y HTML5 que se siguen uso y personalmente me encanta por lo tanto, i encontrar issuse en dispositivos móviles que mi problema se relatd a escala
sí tengo experiencia de mi auto sin embargo yo soy un estudiante inscrito en html html5 y para begineers me gustaría seguir w3chools enlace
http://www.w3schools.com/html/html_images.asp
usted ganará mucho de esta [página
Cuando se le pregunta si hay algo mejor o no, sh debería dar un medio para la comparación. Mejor de qué manera, o con qué propósito? Hay herramientas más potentes que los mapas de imágenes a nuestra disposición, más complejas también ... –
Buen punto: hace tiempo que no uso un mapa de imágenes y pensé que podría haber sido reemplazado por un método mejorado de codificación. – ss888
Javascript/funcionalidad basada en capas, y flash han reemplazado mapas de imágenes en casi todo lo que encuentro ... No puedo recordar la última vez que vi uno en servicio activo. Sin embargo, si tiene un propósito específico en mente, una respuesta más específica podría estar más disponible :) –