Ajout texte au survol d'une image
Résolu
moumouz
Messages postés
37
Date d'inscription
Statut
Membre
Dernière intervention
-
momouz -
momouz -
Bonjour a tous,
Sous XP, je souhaite , en survol ,lorsque la souris passe sur un personnage d'une photo que le nom de celui-ci apparaisse.
Qui peut me donner la solution ?
D'avance MERCI
Sous XP, je souhaite , en survol ,lorsque la souris passe sur un personnage d'une photo que le nom de celui-ci apparaisse.
Qui peut me donner la solution ?
D'avance MERCI
A voir également:
- Faire apparaitre du texte au survol d'une image
- Apparaitre hors ligne instagram - Guide
- Extraire texte d'une image - Guide
- Comment faire apparaître la tabulation sur word - Guide
- Insérer une image dans word sans bouger le texte - Guide
- Image iso - Guide
6 réponses
Salut Moumouz,
L'habitude des forums "programmation", "Webmastering" et "Internet"... au temps pour moi.
Il n'existe pas d'informations dans les images JPEG permettant de délimiter des zones et de leur attribuer un titre (et par conséquent aucune visionneuse d'images capable de le faire). Par contre si tu insères ton image dans une page HTML (là tu entres dans la programmation Web) tu as la possibilité de définir des zones (appelées MAP) mais on change de registre (infos sur http://www.allhtml.com/articles/detail/371).
L'habitude des forums "programmation", "Webmastering" et "Internet"... au temps pour moi.
Il n'existe pas d'informations dans les images JPEG permettant de délimiter des zones et de leur attribuer un titre (et par conséquent aucune visionneuse d'images capable de le faire). Par contre si tu insères ton image dans une page HTML (là tu entres dans la programmation Web) tu as la possibilité de définir des zones (appelées MAP) mais on change de registre (infos sur http://www.allhtml.com/articles/detail/371).
bonsoir et merci pour tes conseils: j'ai reussi ,avec le programme ci-dessous ,a inserer une image dans une page HTML et faire apparaitre au passage de la souris un nom sur l'ensemble de la photo mais pas un nom precis sur lchaque visage .
<HTML>
<HEAD>
<TITLE>image</TITLE>
</HEAD>
<BODY>
Voici une première image sans attribut particulier : <BR>
<CENTER><img src="image1.gif"title="Alain"> </CENTER>
<BR><BR>
</BODY>
</HTML>
peut etre tu pourrais continuer tes conseils et me preciser la marche a suivre.
encore merci
<HTML>
<HEAD>
<TITLE>image</TITLE>
</HEAD>
<BODY>
Voici une première image sans attribut particulier : <BR>
<CENTER><img src="image1.gif"title="Alain"> </CENTER>
<BR><BR>
</BODY>
</HTML>
peut etre tu pourrais continuer tes conseils et me preciser la marche a suivre.
encore merci
Re :)
Ah ben c'est très bien pour une première page HTML. Tu as bien compris le fonctionnement de la balise <img/>, maintenant on va t'aider à créer une carte de ton image ! Youppiiiiiiiiiiiiiiiiiiie ! :D (fais pas attention à ma folie, on n'est que lundi).
Toujours dans la balise <img/> tu vas placer un attribut du nom de "usemap".
Avant ou après ta balise <img/> (ou n'importe où en fait) il te faudra créer une balise <map> qui contiendra des zones (area) comme ceci :
L'attribut shape détermine la forme de la zone (rect c'est un rectangle)
L'attribut coords représente les points de cette zone (un rectangle a besoin de 4 points pour être dessiné).
L'attribut title sera attribué à la zone et c'est ainsi que tu pourras distinguer tes personnages.
Mais à ce niveau là tu trouveras bien plus d'infos sur
http://www.accessiweb.org/fr/guide_accessiweb/guide-accessiweb-fiche-1-5.html
que dans ma tête ^^ ;-)
Bon courage pour la suite !
Et tu peux créer autant de zones que tu le souhaites (songe à ne pas déborder une zone sur une autre).
Ah ben c'est très bien pour une première page HTML. Tu as bien compris le fonctionnement de la balise <img/>, maintenant on va t'aider à créer une carte de ton image ! Youppiiiiiiiiiiiiiiiiiiie ! :D (fais pas attention à ma folie, on n'est que lundi).
Toujours dans la balise <img/> tu vas placer un attribut du nom de "usemap".
<img src="" title="" usemap="#carte1" />N'oublie pas le # c'est très important.
Avant ou après ta balise <img/> (ou n'importe où en fait) il te faudra créer une balise <map> qui contiendra des zones (area) comme ceci :
<map name="carte1"> <area shape="rect" coords="10, 10, 20, 20" title="ma tête"></area> </map>
L'attribut shape détermine la forme de la zone (rect c'est un rectangle)
L'attribut coords représente les points de cette zone (un rectangle a besoin de 4 points pour être dessiné).
L'attribut title sera attribué à la zone et c'est ainsi que tu pourras distinguer tes personnages.
Mais à ce niveau là tu trouveras bien plus d'infos sur
http://www.accessiweb.org/fr/guide_accessiweb/guide-accessiweb-fiche-1-5.html
que dans ma tête ^^ ;-)
Bon courage pour la suite !
Et tu peux créer autant de zones que tu le souhaites (songe à ne pas déborder une zone sur une autre).
Salut ,
C'est encore moi, j'ai essayais de suivre tes conseils malheureusement sans resultats.
Alors voila ce que j'ai ecrit:
<HTML>
<HEAD>
<TITLE>image</TITLE>
</HEAD>
<BODY>
<img src="image1.gif"title="Ma BOUILLE" />
<img src="" title="" usemap="#carte1" />
<map name="carte1">
<area title="" shape="rect"coords="10,10,20,20"alt="essai"></area>
</map>
<BR><BR>
</BODY>
</HTML>
Resultat un carre avec une croix rouge en bas et a droite de la photos qui quand je passe dessus m'indique "essai": par contre quand je passe sur la photo a m'importe quel endroit m'indique toujours ma bouille.
Ne manque t il pas les zones cliquable sur chaque visage de la photo ?
J'ai visité le site accessiweb mais je suis arrivé au meme resultat.
Alors que faire ? peut etre que tu as la solution j'aimerais quand meme bien comprendre.
Merci et peut etre a +
Salut
C'est encore moi, j'ai essayais de suivre tes conseils malheureusement sans resultats.
Alors voila ce que j'ai ecrit:
<HTML>
<HEAD>
<TITLE>image</TITLE>
</HEAD>
<BODY>
<img src="image1.gif"title="Ma BOUILLE" />
<img src="" title="" usemap="#carte1" />
<map name="carte1">
<area title="" shape="rect"coords="10,10,20,20"alt="essai"></area>
</map>
<BR><BR>
</BODY>
</HTML>
Resultat un carre avec une croix rouge en bas et a droite de la photos qui quand je passe dessus m'indique "essai": par contre quand je passe sur la photo a m'importe quel endroit m'indique toujours ma bouille.
Ne manque t il pas les zones cliquable sur chaque visage de la photo ?
J'ai visité le site accessiweb mais je suis arrivé au meme resultat.
Alors que faire ? peut etre que tu as la solution j'aimerais quand meme bien comprendre.
Merci et peut etre a +
Salut
Grand Merci, malheureusement je n'arrive toujours pas au resultat J'ai ecrit:
<HTML>
<HEAD>
<TITLE>image</TITLE>
</HEAD>
<BODY>
<img src="photo1.gif" title="Ma BOUILLE" usemap="#alain1" />
<map name="alain1">
<area title="" shape="rect"coords="10,10,20,20"alt="essai"></area>
</map>
<BR><BR>
</BODY>
</HTML>
la photo s'affiche, et au pasage de la souris sur la photo "ma bouille "s'affiche;
impossible comme je le souhaite d'afficher un nom sur un visage de la photo.
je suis preneur de tous conseils merci et peut-etre a +
<HTML>
<HEAD>
<TITLE>image</TITLE>
</HEAD>
<BODY>
<img src="photo1.gif" title="Ma BOUILLE" usemap="#alain1" />
<map name="alain1">
<area title="" shape="rect"coords="10,10,20,20"alt="essai"></area>
</map>
<BR><BR>
</BODY>
</HTML>
la photo s'affiche, et au pasage de la souris sur la photo "ma bouille "s'affiche;
impossible comme je le souhaite d'afficher un nom sur un visage de la photo.
je suis preneur de tous conseils merci et peut-etre a +
Re,
1. Ton title dans l'area ne doit pas être vide, c'est lui qui contiendra le texte de l'info-bulle.
2. Les coordonnées du rectangle doivent correspondre aux coordonnées où se trouve le visage sur ta photo. Pour t'aider à déterminer les coordonnées tu peux télécharger le logiciel Mapthis (instructions fournies) : http://www.ccim.be/ccim328/htmlplus/mapthis.htm (10,10,20,20 c'était juste un exemple ;-))
3. Tu dois avoir autant d'areas que de visages.
Voilà :-)
1. Ton title dans l'area ne doit pas être vide, c'est lui qui contiendra le texte de l'info-bulle.
2. Les coordonnées du rectangle doivent correspondre aux coordonnées où se trouve le visage sur ta photo. Pour t'aider à déterminer les coordonnées tu peux télécharger le logiciel Mapthis (instructions fournies) : http://www.ccim.be/ccim328/htmlplus/mapthis.htm (10,10,20,20 c'était juste un exemple ;-))
3. Tu dois avoir autant d'areas que de visages.
Voilà :-)
Vous n’avez pas trouvé la réponse que vous recherchez ?
Posez votre question
Salut, avec une info-bulle c'est faisable. En gros tu mets le nom de ce personnage dans la propriété "title" de ta balise "img".