Creer une zone cliquable sur un image ?
- Auteur de la discussion deleter23
- Date de début
En mode code et création :
Tu ouvres une images, tu cliques dessus.
Dans le panneau de propriété (Menu/fenêtre/propriété activé), tout en bas à gauche, tu as trois formes géométriques, rectangle, ovale et polygone. tu cliques sur une des trois, tu créé une zone sur ton image grâce a cette outil.
Tu rentres ensuite les champs lien, cible etc... dans le panneau de propriété et c'est tout.
Si tu as tracé plusieurs formes, il faut deselectionner cette outil en reprenant la flèche noir à gauche des forme dans le panneau des propriétés.
Ce qui doit donner un truc comme ça :
Tu ouvres une images, tu cliques dessus.
Dans le panneau de propriété (Menu/fenêtre/propriété activé), tout en bas à gauche, tu as trois formes géométriques, rectangle, ovale et polygone. tu cliques sur une des trois, tu créé une zone sur ton image grâce a cette outil.
Tu rentres ensuite les champs lien, cible etc... dans le panneau de propriété et c'est tout.
Si tu as tracé plusieurs formes, il faut deselectionner cette outil en reprenant la flèche noir à gauche des forme dans le panneau des propriétés.
Ce qui doit donner un truc comme ça :
Code:
<body>
<p><img src="tonimage.jpg" width="292" height="118" border="0" usemap="#Map">
<map name="Map">
<area shape="rect" coords="56,23,166,82" href="http://www.exemple.com">
<area shape="rect" coords="25,89,39,106" href="#">
<area shape="rect" coords="86,96,107,111" href="#">
<area shape="rect" coords="228,42,248,65" href="#">
<area shape="rect" coords="256,24,271,32" href="#">
<area shape="circle" coords="35,22,13" href="#">
<area shape="poly" coords="57,101,66,100,57,84,65,96,68,101" href="#">
<area shape="rect" coords="195,85,235,104" href="#">
<area shape="rect" coords="189,29,218,69" href="#">
<area shape="rect" coords="24,39,36,61" href="#">
</map>
</p>
</body>Et si tu cherches plus élégant et avec moins de code HTML :
http://css.alsacreations.com/Tutoriels- ... map-en-CSS
http://css.alsacreations.com/Tutoriels- ... map-en-CSS
Nouveau WRInaute
Bonjour, j'ai trouvé le moyen de créer une zone cliquable sur une image via WebExpert, seulement le code où se trouve cette image (en l'occurence mon logo) se prête peu à des modifications, le voici :
<style type="text/css" media="screen">
#header { background: url("<?php bloginfo('stylesheet_directory'); ?>/images/kubrickheader.png") no-repeat bottom center; }
</style>
l'image en question étant kubrickheader.png
Avez-vous une idée de la façon dont je peux insérer le code <map></map> sans que cela fasse bugger l'ensemble ?
Merci
<style type="text/css" media="screen">
#header { background: url("<?php bloginfo('stylesheet_directory'); ?>/images/kubrickheader.png") no-repeat bottom center; }
</style>
l'image en question étant kubrickheader.png
Avez-vous une idée de la façon dont je peux insérer le code <map></map> sans que cela fasse bugger l'ensemble ?
Merci
Ton logo fait partis du contenu de ta page. L'utilisation du CSS pour afficher ton logo en fond de conteneur est inappropriée.
La solution : mettre ton logo à l'aide d'une balise "img" et faire tout simplement un lien dessus.
Pas besoin de zone cliquable pour ça ... :wink:
P.S. : bienvenue à toi sur wri
:wink:
La solution : mettre ton logo à l'aide d'une balise "img" et faire tout simplement un lien dessus.
Pas besoin de zone cliquable pour ça ... :wink:
P.S. : bienvenue à toi sur wri
:wink:➡️ Offre MyRankingMetrics ⬅️
pré-audit SEO gratuit avec RM Tech (+ avis d'expert)
coaching offert aux clients (avec Olivier Duffez ou Fabien Faceries)
Voir les détails ici
Discussions similaires
