Liens cliquable sur certaine zone d'une image

Résolu/Fermé

Koma777 Messages postés 261 Date d'inscription mercredi 17 janvier 2007 Statut Membre Dernière intervention 16 février 2018 - 4 déc. 2009 à 19:41
Koma777 Messages postés 261 Date d'inscription mercredi 17 janvier 2007 Statut Membre Dernière intervention 16 février 2018 - 4 déc. 2009 à 20:11

Bonjour,
je suis à la recherche d'une méthode permettant de créer des liens cliquable sur certaine zone d'une image.
Et je ne souhaites pas utiliser de map area.

J'ai donc pensé à mettre une image dans une div, dans laquelle je rajouterais d'autres div cliquables, me renvoyant sur une page web de mon choix.

#monimage
{
	background-image:(../images/mon_image.jpg);
	height:1024px;
	width:800px;
	display:block;
}

#lien1
{
         width:200px;
         height:300px;
         margin:168px 0 0 0;  //permettant de placer à mon gré le lien
}


<div id="monimage">
	    <div id="lien1">
             <a href="https://www.google.com/?gws_rd=ssl" > </a> 
            </div>
</div>

Auriez vous une solution?

Merci d'avance!

A voir également:

Liens cliquable sur certaine zone d'une image
Zone telechargement - Guide
Image iso - Guide
Comment agrandir une image - Guide
Acronis true image - Télécharger - Sauvegarde
Frédéric cherche à faire le buzz sur les réseaux sociaux. il a ajouté une image d’ours polaire sur une image de plage. retrouvez l'image originale de la plage. que cache l'ours polaire ? - Forum Loisirs / Divertissements

4 réponses

Réponse 1 / 4

avion-f16 Messages postés 19244 Date d'inscription dimanche 17 février 2008 Statut Contributeur Dernière intervention 17 avril 2024 4 496
4 déc. 2009 à 19:58

N'importe quoi, c'est comme te demander de faire décoller un F-16 sans démarrer le réacteur !

Fait comme-ceci :

<div id="image">
    <a href="page.html" class="lien1"></a>
</div>

Et dans le CSS :

#image {
    width:640px; // largeur de l'image
    height:480px; // hauteur de l'image
    background: url('image.png'); // url de l'image
}
#image .lien1 {
    display:block;
    position:relative;
    top: 10px;
    left:10px;
    width:50px;
    height:50px;
}

Ce code créera un carré de 50px à 10px de la gauche et du haut.

Réponse 2 / 4

avion-f16 Messages postés 19244 Date d'inscription dimanche 17 février 2008 Statut Contributeur Dernière intervention 17 avril 2024 4 496
4 déc. 2009 à 19:44

“Et je ne souhaites pas utiliser de map area.”
Et pourquoi donc ?
C'est l'une des meilleurs solution (la seule ?) et tu n'en veux pas :-/

Réponse 3 / 4

Koma777 Messages postés 261 Date d'inscription mercredi 17 janvier 2007 Statut Membre Dernière intervention 16 février 2018 7
4 déc. 2009 à 19:49

Je dois le faire d'une autre manière... tout simplement car c'est marqué dans mon sujet... :/

Comment créer une div cliquable?

Réponse 4 / 4

Koma777 Messages postés 261 Date d'inscription mercredi 17 janvier 2007 Statut Membre Dernière intervention 16 février 2018 7
4 déc. 2009 à 20:11

Merci avion f-16! ça marche ! :)

Discussions similaires

Retrouver l'image originale après avoir fait des modifications ?

transformer un photo simple en un lien

Vidéo : comment changer sa zone géographique ?

Image cliquable dans html

Résolution d'une image 500 pixels largeur

Discussions similaires

Newsletters