[SOLUCIONADO] Imagen hexagonal, esquinas

[reonevk]

Buenas a todos, mi problema es el siguiente:

Estoy haciendo un juego donde el tablero esta compuesto con casillas hexagonales, como podeis ver en esta imagen: http://tinypic.com/r/5txxef/5

El problema surje al añadir el evento click de JQuery a las imagenes para capturar en que casilla se a clickeado, dado que las imagenes son cuadradas, aunque con fondo transparente para no tapar parte de los exagonos que tiene al lado, pues al cliquear esas esquinas invisibles de las imagenes si cuentan.

No se si me e explicado bien, la cosa es que si cliqueas en las esquinas de la imagen real( Cuadrada ) aunque visualmente esta fuera del hexagono, si que estas cliqueando en el hexagono.

Alguna idea o ayuda???

gracias de antemano

[Panino5001]

Hola, reonevk! Podés estudiar alguna de estas opciones:

Mapeo de imágenes: http://www.caricatos.net/mapas/index.php

SVG: http://www.svgbasics.com/paths.html
o SVG y CSS:
http://css-tricks.com/using-svg/

Canvas: https://developer.mozilla.org/en-US/...anvas_tutorial
https://developer.mozilla.org/sample..._clipping.html

Sólo CSS:
http://ksesocss.blogspot.com/2012/08...gonos-css.html

[reonevk]

valeeeee muchas gracias, voy a echarle un ojo.

Graciaaaaas

[caricatos]

Hola:

Si te decides por los mapas, tal vez te interese más una versión algo mejorada: Capturar áreas en imágenes, donde en cada captura puedes obtener sus coordenadas, que simplemente tendrías que incluír en el atributo coors de un area con shape polygon.

Saludos