Image de fond cliquable [Résolu]

marcandre · 10/02/2011, 15h12

Bonjour à tous,

Je voudrais savoir comment peut-on rendre une image de fond cliquable mise dans une page web ?

Cordialement.

RomainVALERI · 10/02/2011, 15h44

La formulation de la question.... est spéciale.

Quoi qu'il en soit, si tu veux une image cliquable et que ce n'est pas une balise <img> mais plutôt un autre élément avec une image en background (si j'ai bien compris

), place un gestionnaire onclick sur l'élément dont l'image est en fond ^^

marcandre · 10/02/2011, 16h01

C'est exactement une image en background .

Comment peut-on fait ce genre de gestionnaire d'évènement ?

Merci .

RomainVALERI · 10/02/2011, 16h08

Admettons que l'élément en question (je suis obligé de supposer puisque tu ne nous as pas donné l'info

) soit une cellule de tableau, dont l'id est "idCellule" (ce n'est qu'un exemple, hein

ne l'appelle pas comme ça, s'il te plait

)

Tu peux faire :

Code javascript :

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

1
2
3
4
var el = document.getElementById("idCellule");
el.onclick = function() {
   // ici les actions à effectuer en cas de clic
}

marcandre · 10/02/2011, 16h19

Autant pour moi, j'ai omis de préciser que l'image était en background dans la balise body et que seul le la balise body est cliquable mise à part les autres éléments HTML qu'il y a à l'intérieur comme table, input ...

Merci pour ta réponse .

NoSmoking · 10/02/2011, 20h46

Bonsoir,
tu peux toujours mettre une DIV en position absolute, hors flux donc, que tu positionnes là ou tu le souhaites.

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">
<html >
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>CSS zone cliquable sur background</title>
<head>
<style type="text/css">
html, body {
  margin : 0;
  padding : 0;
  background: url( image_fond.jpg);
  height : 100%;
}
#cliquable {
  position : absolute;               /* sort la DIV du flux */
  display : block;                   /* si pas une DIV */
  left : 100px;
  top  : 100px;
  width : 100px;
  height : 100px;
  border : 1px solid #e0e0e0;        /* uniquement pour visualisation */
}
#conteneur {
  margin : auto;
  width : 600px;
  height : 100%;
  border: 1px solid #e0e0e0;
}
</style>
</head>
<body>
<div id="cliquable" onclick="alert('cliquez n\'est pas jouez!');"></div>
<div id="conteneur">
</div>
</body>
</html>

tu pourras toujours jouer avec le z-index pour la placer au dessus du panier si nécessaire.

10/02/2011, 15h12	#1
marcandre Membre du Club Inscription : mars 2007 Messages : 221 Détails du profil Informations forums : Inscription : mars 2007 Messages : 221 Points : 48 Points : 48	Image de fond cliquable Bonjour à tous, Je voudrais savoir comment peut-on rendre une image de fond cliquable mise dans une page web ? Cordialement.
	00

10/02/2011, 15h44	#2
RomainVALERI Expert Confirmé Sénior Romain VALERI POOête Inscription : avril 2008 Messages : 2 572 Détails du profil Informations personnelles : Nom : Romain VALERI Âge : 35 Localisation : France, Meurthe et Moselle (Lorraine) Informations professionnelles : Activité : POOête Informations forums : Inscription : avril 2008 Messages : 2 572 Points : 4 073 Points : 4 073	La formulation de la question.... est spéciale. Quoi qu'il en soit, si tu veux une image cliquable et que ce n'est pas une balise <img> mais plutôt un autre élément avec une image en background (si j'ai bien compris ), place un gestionnaire onclick sur l'élément dont l'image est en fond ^^ __________________ ...pour les linguistes et les curieux >>> générateur de phrases aléatoires __________________
	00

10/02/2011, 16h01	#3
marcandre Membre du Club Inscription : mars 2007 Messages : 221 Détails du profil Informations forums : Inscription : mars 2007 Messages : 221 Points : 48 Points : 48	C'est exactement une image en background . Comment peut-on fait ce genre de gestionnaire d'évènement ? Merci .
	00

10/02/2011, 16h19	#5
marcandre Membre du Club Inscription : mars 2007 Messages : 221 Détails du profil Informations forums : Inscription : mars 2007 Messages : 221 Points : 48 Points : 48	Autant pour moi, j'ai omis de préciser que l'image était en background dans la balise body et que seul le la balise body est cliquable mise à part les autres éléments HTML qu'il y a à l'intérieur comme table, input ... Merci pour ta réponse .
	00

Outils de la discussion
Afficher une version imprimable Envoyer un lien vers cette page par email