Zone cliquable sur des images avec transparen

Fermé
Overstyle - 17 août 2008 à 21:53
 Shapes - 20 janv. 2010 à 17:46
Bonjour à tous,

J'aimerais savoir s'il est possible, et si oui comment faire pour que la zone cliquable d'une image ne prenne pas en compte la transparence de cette dernière?

Ce sont des images en png-8, ce n'est pas un problème d'affichage car la dessus la transparence est bien prise en compte.

PS: je dois à tout prix éviter les area shape car ces zones cliquables changeront de couleur Roll Over (javascript)

J'espère que quelqu'un à saisi ce que je veux dire

merci d'avance

3 réponses

Groarh Messages postés 682 Date d'inscription vendredi 1 août 2008 Statut Membre Dernière intervention 28 juin 2015 185
18 août 2008 à 12:09
En html et xhtml, une image est rectangulaire, et le seul moyen de changer cette forme est d'utiliser les areas.
Dans ton cas, tu dois en conclure que l'objet image ne te sauvera pas. => Il faut utiliser un objet flash !

Reprends tes PNG et intègre-les dans flash en suivant la procédure habituelle pour faire des boutons. Pour l'état "over", tu mets une autre image qui aura la même forme mais pas la même couleur, en la calant bien par-dessus la première.
Simple ! Et même pas besoin de javascript.
1
Salut,

Groarh> est ce que je pourrais avoir la solution en javascript stp ? Dans mon cas, je ne peux pas utiliser du flash.

Merci
0
Groarh Messages postés 682 Date d'inscription vendredi 1 août 2008 Statut Membre Dernière intervention 28 juin 2015 185
13 févr. 2009 à 15:23
Hello,

il y a moyen de faire ça en JavaScript, mais la méthode est peu élégante. L'idée est de relever les coordonnées de la souris à chaque clic sur l'image, et de ne rien faire si ça correspond à une zone transparente. Ca risque de rendre le code très lourd, surtout si l'image est complexe ...

Si tu es sûr de vouloir faire ça, montre-moi ton image et j'essayerai de te faire un script le plus compact possible. (L'idéal serait de pouvoir décrire les contours des zones transparentes avec des fonctions mathématiques assez simples. En gros on refait "à la main" les routines de traitement du flash ... sauf que comme c'est interprété à la volée, ce sera beaucoup plus lent ...)

J'attends ta réponse. ;)
0
Ah d'accord :s

Je ne vais pas t'embeter a faire ce que tu a proposé comme solution, car elle n'ira pas non plus ^^'

Le truc, c'est qu'il y a plusieurs images superposées et que si c'est une zone transparente pour l'une des images, ca ne sera pas une zone transparente pour une autre image se trouvant en dessous.
0
Shapes > MaitreDragon
20 janv. 2010 à 12:27
Salut MaitreDragon,
J'ai exactement le même besoin que toi.
As-tu trouvé la solution ? Si oui, comment ?
Dans l'espoir d'une réponse,
Cordialement
Shapes
0
Shapes > MaitreDragon
20 janv. 2010 à 17:41
Re-salut,

J'ai trouvé une manière de le faire...

https://cyberzoide.developpez.com/html/map.php3

Ca fonctionne, par contre, je n'arrive pas à faire d'effet mouseover (changement de l'image au passage souris) avec cette technique...

Cordialement,
Shapes
0
Shapes > MaitreDragon
20 janv. 2010 à 17:46
Re-salut,
J'ai trouvé une solution ici :
https://cyberzoide.developpez.com/html/map.php3
Par contre, je n'arrive pas à faire d'effet mouseover (changement de l'image au passage de la souris) avec cette technique... Si quelqu'un a une idée ?
Cordialement,
Shapes
0