Plusieurs liens sur une image?

Version imprimable

31/07/2006, 17h14
spirit69

Plusieurs liens sur une image?

Bonjour.

Dans le but d'apporter un peu "d'interactivité" dans l'utilisation d'un manuel en reseau je souhaite utiliser quelque images.

Imaginons qu'il s'agit d'une frise chronologique.

____________________________________________\
Date | Date2 | Date3 | ........................................\
_____________________________________________/
/

Il s'agit d'une simple image JPEG.
Ce que je cherche est de pourvoir y "inserer plusieurs liens"
La Zone autour de Date envoi vers lien X
La zone autour de Date2 .................Y
......
Mon image étant beaucoup plus "compliquée" qu'une simple frise (il y a des zones un peu partout) je n'ose pas vraiment procéder par découpe de plusieurs petites images que je ne pense pas arriver à recoller en html...

Existe t'il un éditeur capable d'assigner des zones sur une image?

J'espere que ma question est assez claire.
Merci
31/07/2006, 18h37
Arnaud F.

Oui, sache déjà que c'est possible, selon que tu clique dans cette ou cette partie de l'image, ça te renvoi vers tel et tel lien ;)

Mon prof nous a montrer en cours que c'était faisable :D

En fait faut découper l'image selon les coordonnées que tu lui attribue, mais bon, je sais s'il existe d'éditeur permettant de faire ça, surement mais je n'en connais pas :(

@+

Oui j'en connais un moi !
ScriptEdit :) Je me renseigne sur comment faire et je réedite le message (je m'en souviens plus :P)

Edit :

Bon le lien est mort alors je vais t'expliquerv voila a quoi ressemble le code :
Code:

1 2 3 4 5 6 7 <map name="carte"> <area shape="rect" coords="11,10,59,29" href="" alt=""> <area shape="rect" coords="42,36,96,57" href="" alt=""> <area shape="rect" coords="42,59,78,80" href="" alt=""> </map> <p><img src="carte.gif" width="345" height="312" border="0" alt="carte" usemap="#carte"></p>
shape="" c'est le type de forme (rectangle,cercle,...)
coords c'est la position des coins, on le code comme ca :
x1 = coin en haut à gauche, pixels à partir de la gauche
y1 = coin en haut à gauche, pixels à partir du haut
x2 = coin en bas à droite, pixels à partir de la gauche
y2 = coin en bas à droite, pixels à partir du haut
(Pour un rectangle évidemment)

Voila en esperant t'avoir aidé :)

Il est vrai que tu peux découper ton image en plusieurs zones interactives mais ceci en déterminant des coordonnées.

ex :
Code:

1 2 3 4 5 6 <map name="testimage"> <area shape="rect" coords="10,9,58,27" href="#top"> <area shape="circle" coords="104,18,14" href="#map"> </map> <img src="image.gif" border=0 width=136 height=36 usemap="#testimage" alt="Exemple balise MAP">
Après je ne connais absolument pas d'éditeur de texte qui fait cela automatiquement.

31/07/2006, 19h35
liza83

fireworks te permet de tracer des zones sur ton image, pour réaliser des liens.
donc j'imagine également que Dreamweaver le fait également.
31/07/2006, 19h38
Candygirl

Citation:

Envoyé par liza83

donc j'imagine également que Dreamweaver le fait également.

oui, Dreamweaver le fait :)
31/07/2006, 19h39
fallais

Citation:

Envoyé par Candygirl

oui, Dreamweaver le fait :)

Quand on est une usine a gaz comme Deamweaver, je pense qu'effectivement on peut faire les area ... :)
02/08/2006, 11h39
spirit69

Merci pour toutes ces réponses aussi rapides.
Je suis un peu débordé donc je check qu'aujourd'hui.

J'ai pu mettre en pratique la creation d'une zone.

(avec notepad :aie: j'espere trouver un outil)

Donc : sur l'image je délimite une zone (taille, emplacement).
Je lui ai rajouté un effet 'survol'. quand la souris passe, une nouvelle image aparait un peu comme un zoom sur la zone.
Donc en gros c'est que je cherchais.
Mais maintenant il m'en faut plusssssss :mrgreen:

Je m'explique.
Je voudrais :
Survoler Zone1 => apparition de Zone2 (Zoom de Zone1) => Survoler des zones de Zone2 => appartition de Zone3(Zoom de Zone2) ...

Bref une espece de cascade de zones.

Je pense que c'est possible. Pour le moment c'est tout grace à du CSS.

Si quelqu'un me trove "l'outil miracle'...
02/08/2006, 11h43
BizuR

Outil : Versions de démonstration DreamWeaver et FireWorks je dirai. Le premier travaille bien les pages HTML, le second travaille très bien les images destinées au WEB; sachant qu'il peut aussi généré le code HTML en rapport avec ton travail sur l'image.

Les versions d'évaluation sont disponibles sur le site de MacroMedia après inscription gratuite et sans engagements.

Bon courage :D
02/08/2006, 13h31
Eowyn87

frontpage le fait aussi :D
02/08/2006, 14h13
masu

Citation:

Envoyé par Eowyn87

frontpage le fait aussi :D

Beurk faut pas utiliser frontpage! Sincerement regarder un peu la pagaille que ca met dans votre code source.
03/08/2006, 09h55
Eowyn87

ouais je sais, mais en stage j'étais "obligée" de l'utiliser xD