[résolu] Image map en CSS limitée à des carrés??

Bonjour,

j'ai besoin de faire des zones cliquables sur une image (carte géographique) avec changement de couleur au passage de la souris.

Bien sûr je veux faire ça en full CSS et, vous me voyez venir, le problèmes est que tous les tutoriaux que j'ai lu se basent sur des zones carrés (normal vu que c'est un a:hover )

Seulement j'ai besoin de plus de précision, car sinon mes visiteurs risquent d'être déroutés si le rollover apparait au mauvais endroit.

Qui aurait une solution miracle??
Modifié par Noisequik (21 Mar 2007 - 10:30)

Bonjour,

Un truc m'intrigue... pourquoi ne pas utiliser les map area, qui en toute apparence, sont tout à fait adapté pour ton cas ? Y'a-t-il une raison particulière qui te pousse à chercher une autre solution ?

Edit : Ah je viens de voir que tu voulais un changement de couleur au passage de la souris... bonne question donc ! Je vais y réfléchir.
Modifié par Tony Monast (20 Feb 2006 - 15:28)

Oui d'une part j'ai lu des phrases comme ça :

a écrit :

Autre inconvénient des image maps classiques : le code produit est souvent long, lourd et difficilement compréhensible... voire tout simplement non valide et/ou non Accessible.

D'autre part j'ai besoin du roll-over et j'apprécie la technique de mettre 2 ou plusieurs images en 1 et d ejouer avec les coordonnées du background

Pour ce qui est de la première partie, je ne suis pas d'accord. Le code d'un map area n'est pas plus long, lourd et difficilement compréhensible qu'autres choses. Personne ne s'empêche d'utiliser les tableaux à cause de l'esthétisme ou la compréhension du code. Pour ce qui est de la validité, encore là, c'est le codeur le problème, pas le map area lui-même.

Finalement, le seul argument qui vaudrait la peine de vérifier est au niveau de l'accessibilité. J'ai du mal à croire qu'un map area bien codé pose des problèmes d'accessibilité. Un spécialiste en accessibilité pourrait confirmer ?

Au niveau des roll-over, ils seraient de quelle nature ? Le texte cliquable qui change de couleur ? Si c'est une carte mondiale par exemple, le fond de chaque pays change de couleur au passage de la souris ?

Edit : Tiens, Gilles en parle.
Modifié par Tony Monast (20 Feb 2006 - 15:54)

oui le fond ainsi que le texte du pays deviennent inversés au passage de la souris...

J''aimerais éviter le plu spossible JavaScript, petite précision
Modifié par Noisequik (20 Feb 2006 - 15:54)

En ce moment, je n'ai pas le temps requis pour faire des recherches, mais je tenterai de me trouver du temps ce midi.

a+

ok c'est gentil, bien que je pense que le problème soit très compliqué....

edit: perds pas trop de temps, je vais écarter les pays pour contourner le problème...
Modifié par Noisequik (20 Feb 2006 - 17:36)

Par hasard, aujourd'hui même, je dois travailler sur une carte de la région avec des zones réactives. J'utilise les map area. Quand je désactive les images du navigateur Firefox, je ne vois même pas les zones réactives avec les alt dans l'image. Niveau accessibilité, c'est plutôt proche du zéro si je ne répète pas les liens plus bas.

Tu avais donc raison d'éviter les map area, ne serait-ce que pour ce problème. Je suis plutôt dans le jus cet après-midi, je vais laisser les map area, mais prochainement, je vais sans doute trouver une autre solution comme celle que tu recherche, avec les rollovers. Parce que là ce n'est pas très agréable à utiliser.

À demain peut-être !
Modifié par Tony Monast (20 Feb 2006 - 22:24)