Bonjour à tous,

J'ai deux balises DIV sur la page web : une balise DIV nommé cliquable et une balise conteneur . La balise div "cliquable" possède un lien vers javascript et et la balise "conteneur" non cliquable .

Sur la page web la balise div cliquable est en partie superposée sur la balise conteneur .

Je souhaite que la zone où la balise cliquable superposée sur la balise conteneur ne soit pas cliquable et la partie non superposée cliquable .

Au niveau de mes résultats, cela fonctionne sous IE mais pas sous Firefox, ni Chrome . Sur les deux derniers navigateurs cités, la balise div "cliquable" est entièrement cliquable y compris sur la partie superposée à la balise conteneur .

Voici le code que je test en ce moment :
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
<html>
<head>
<title>Test des zones cliquables</title>
</head>
<body>
<style>
#cliquable {
  position : absolute;             
  display : block;                   
  left : 550px;
  top  : 100px;
  width : 100px;
  height : 100px;
  border : 1px solid #e0e0e0;        
        cursor:pointer;
        z-index:0;
}
#conteneur {
  width : 600px;
  height : 400px;
  border: 1px solid #e0e0e0;
  z-index:10;
}
 
 
</style>
<div id="cliquable" onclick="alert('test');"></div><div id="conteneur"></div>
</body>
</html>
Sur le code, j'utilise l'attribut z-index de façon à ce que la balise div "conteneur" soit au dessus de la balise "cliquable", cette fonctionnalité est prise en compte par IE mais pas par Firefox ni Chrome . Comment peut on rendre la zone non cliquable où les deux balises ce croisent sous Firefox ?

Cordialement.