Usemap : personnalisation?

Bonjour =)

Je souhaiterais vous soumettre un casse-tête qui m'ennuie depuis pas mal de temps et auquel je ne trouve pas de réponse (enfin si, négative, mais je veux m'assurer qu'il n'y a aucun espoir).

En effet, je voudrais faire un "menu" (faute de meilleur mot) en formes triangulaires, cliquables. Jusque là rien de compliqué, j'ai utilisé Usemap sur une image regroupant tous ces triangles. Mais j'aurais également voulu que ces triangles changent de couleur au survol... et je ne sais pas sur quoi utiliser ma petite propriété !

Est-ce que les zones définies par Usemap ont la possibilité d'être "décorées" via CSS? Je ne pense pas, mais il serait dommage de laisser tomber sans avoir posé la question moi-même.

Et sinon, y aurait-il un autre moyen? J'ai essayé la méthode un peu sale de faire des div triangulaires à l'aide de la bordure, mais c'est pas folichon je vous l'avoue.
J'ai aussi pensé à faire des div rectangulaires tout ce qu'il y a de plus normal et de leur appliquer une image de triangle en background, mais les différents triangles doivent malheureusement être trop proches les uns des autres pour que ça fonctionne correctement au niveau des liens (trop de chevauchement, il faut vraiment avoir la souris pile au milieu du div pour être correctement redirigé, ce qui est plutôt fâcheux).

D'où mon interrogation avec Usemap ^^

Bref, merci d'avoir pris le temps de me lire. Toutes les solutions seront les bienvenues, et merci infiniement à ceux qui prendront le temps de se pencher là-dessus
Modifié par Pixellyn (23 May 2016 - 15:21)

OUH PITAIN

Alors, en faisant une recherche de plus mais en partant complètement sur une autre piste, j'ai fini par enfin trouver quelqu'un qui avait un début de réponse. Et ça marche, mais... en JS ^^

(non, je n'avais pas pensé au JS. Je suis un boulet, certes, mais j'aime bien le CSS moi)

Du coup je vais me servir de ça si pas d'autres solutions, mais je suis quand même très intéressée par rapport à Usemap et ce qu'on peut ou pas lui appliquer... Donc si l'un de vous a quand même quelque chose, je lui serai éternellement reconnaissante de le partager ici =)

En attendant je vous donne le lien que j'ai trouvé, sait-on jamais, il pourrait aider d'autres âmes en peine :
HOP HOP HOP

Tu as peut-être moyen de t'en sortir sans JS avec du SVG.

Je ne m'en suis jamais servi, mais ça vaudrait peut-être le coup? Au niveau compatibilité quelle est la meilleure solution d'après toi?

Merci de ta réponse en tous les cas