Discussion :

[iceman2001]

Bonjour à tous,

Petite question.
Je fais le site de ma boite. J'ai une image en background sur ma page html.
En haut à gauche, j'ai le logo que je voudrais rendre cliquable pour accéder au site commercial flash.

Je sais que sur une image on peut utiliser un shape area.
Mais sur un arrière plan, je suis un peu embêté.

Comment dois-je m'y prendre ?

Merci d'avance.

[Bisûnûrs]

Créé ton logo seul que tu ne mets pas en background.

Ou alors tu créés un "calque" que tu positionnes sur ton logo :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

<div style="position:absolute;top:0;left:0;height:100px;width:100px" onclick="alert('coucou')"></div>

[MasterOfChakhaL]

tu peux placer un lien...

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

<a id="logo" href="ton_url" title="bla bla">&nbsp;</a>

l'élément parent doit être positionné via css (position: relative ou position: absolute) pour être pris comme origine des coordonnées pour les éléments enfants.

Code css :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
 
#logo {
  display: block;
  position: absolute;
  top: 20px;
  left: 30px;
  width: 50px;
  height: 20px;
}

a toi de changer les coordonnées

[iceman2001]

Merci, j'essaie tout ça.

[iceman2001]

Merci, j'ai utilisé :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

<div style="position:absolute;top:0;left:0;height:100px;width:100px" onclick="alert('coucou')"></div>

Ca marche super bien.
Par contre, est-il possible de changer le curseur de la souris (main sur lien) quand on passe sur la zone cliquable ?

[Bisûnûrs]

Dans le style, rajoute :

Code CSS :

Sélectionner tout - Visualiser dans une fenêtre à part

cursor:pointer;

[iceman2001]

Ok merci, ça donne donc ça :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

<div style="position:absolute;top:-30px;left:120px;height:310px;width:320px;CURSOR: hand" onclick="window.open('http://www.monsite.com')">

Par contre, je comprends pas, ma zone est bien prise en compte (lien) mais j'ai des "intermitences", des endroits où "ça clique", puis rien sur une dizaine de pixel....puis recliquable......

Comment ça s'explique ?

[Bisûnûrs]

Dans le style, rajoute :

Code CSS :

Sélectionner tout - Visualiser dans une fenêtre à part

cursor:pointer;

Au passage, tu as mis deux fois l'attribut style ...

[Candygirl]

Par contre, est-il possible de changer le curseur de la souris (main sur lien) quand on passe sur la zone cliquable ?

Pourquoi ne pas utiliser alors tout simplement une balise a plutôt qu'un div comme il t'a été proposé plus haut ? Si ton but est de faire un lien, la balise a est tout de même la plus indiquée, il me semble, et tu auras alors ta "main" par défaut...