Discussion :

[hellreaperdd]

Bonjour,

je souhaite rendre mon image de fond cliquable, voici le code que j'utilise :

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
<script type="text/javascript">
function clickBg(e) {
evt = e || window.event;
if (e.target) targ = e.target;
else if (e.srcElement) targ = e.srcElement;
if (targ.nodeType == 3) // Safari bug
targ = targ.parentNode;
 
if (targ.id == 'body') {
window.open('http://google.com/');
}
 
</script>
 
<div class='hab-homepage' onclick="clickBg(event);" id="body"  style='cursor: crosshair' >
 
</div>

je vois bien mon cursor changer, mais rien ne se passe quand je clique dessus...

merci de votre aide!

[SpaceFrog]

j'ai pas compris pourquoi un simple window.open sur le onclick ne conviendrait pas ???

[gwyohm]

sinon, il te manque une accolade fermante en fin de fonction...

[hellreaperdd]

c'est une image qui est en arrière plan d'un site (pour de la pub), mais ça pourrais peut être faire l'affaire. site: http://dev.durable.47.kernix.biz/

Ps: je viens juste de mettre accolade fermante ... merci! mais sa bug toujours

[SpaceFrog]

si les éléments au dessus n'ont pas d'indication pour bloquer la propagation (cancelBubble, stopPropagation ou return false) le click devrait arriver jusqu'à l'element d'arrière plan.
Entendons nous bien on parle d'une balise image et pas d'un style background-image...

[hellreaperdd]

Ce que je voulais c'était que l'image qui est en background dans ma div hab-homepage soit cliquable mais seulement sur les cotés.

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
 
<!--css: -->
 
.hab-homepage {background:white url('/app/durable/pix/Habillage_castorama.jpg') no-repeat top;}
 
<!--jai modifié mon javascripte:  -->
 
function clickBg() {
	newwindow=window.open('http://google.com/');
}
 
<div class='hab-homepage' onclick="clickBg()" style='cursor: crosshair; z-index:3;' >
</div>

le problème c'est que toute la page est clickable et pas juste les bords.

[SpaceFrog]

ha ben met un div au dessus (un peu plus petit) sur lequel tu stoppe la propagation

Code :

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

1
2
<div style="position:absolute;height:300; width:300; top:0; left:0;background-color:red" onclick="alert('touché')"></div>
<div style="position:absolute;height:200; width:200;top:50px; left:50px; border:solid 1px green;"></div>