Creer une zone cliquable sur un image ?
7 messages
• Page 1 sur 1
- bed
- Nouveau WRInaute

- Messages: 31
- Inscription: 5 Avr 2005
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: Tout sélectionner
<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>
-

SIBELIUS - WRInaute occasionnel

- Messages: 287
- Inscription: 21 Déc 2003
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
- Matthieu M.
- Nouveau WRInaute

- Messages: 1
- Inscription: 2 Sep 2007
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
-

Pandore - WRInaute passionné

- Messages: 1441
- Inscription: 14 Oct 2005
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 ...
P.S. : bienvenue à toi sur wri

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 ...
P.S. : bienvenue à toi sur wri
7 messages
• Page 1 sur 1
Lectures recommandées sur ce thème :
- Faire une zone cliquable sur une image mise en background
- Bordure de zone cliquable
- Image cliquable et XHTML
- rendre une image cliquable
- Rendre une image en fond d'écran cliquable
- CSS : rollover d'une image plus grande que la zone lien
- Zone reactive dans une image avec balise alt. Indexée ou pas
- Créer une page de commande avec une zone de calcul dynamique
- Creer un image 9m:2M
- créer une image à côté de l'url
- Yahoo va ouvrir un data center à Avenches en Suisse - 08-10-2007
- GoogleStats : analyse temps réel des visites de Google sur votre site - 02-10-2002
- Nouvelle interface des pages de Google - 26-01-2006
- Google teste la recherche locale (Google Search by Location) - 23-09-2003
- La terre vue par satellite : accord entre Google et Spot Image - 23-01-2007
- Tutoriel sur le sitemap Google pour les images - 12-04-2010
- Ajouter un moteur de recherche d'images sur son site - 24-07-2007
- Idées d'optimisation du référencement des images - 19-09-2008
Consultez la description détaillée des produits ou services de Google suivants : Google Image Labeler
- Transformer des textes non cliquables en liens
Cet outil vous permet de trouver des pages citant votre site mais ne faisant pas (encore) de lien. Il suffira parfois d'un simple mail pour transformer cette simple citation en lien (backlink). - Combinaison de mots-clés
Cet outil vous permet de créer à partir de quelques mots-clés une liste d'expressions constituées des mots pris dans tous les ordres possibles. Il sert aux analyses de positionnement et achats de mots-clés.
Qui est en ligne
Utilisateurs parcourant ce forum: Aucun utilisateur enregistré et 1 invité
