Z-index et javascript [Résolu]

Signaler
Messages postés
3
Date d'inscription
samedi 7 août 2010
Statut
Membre
Dernière intervention
10 juillet 2013
-
Messages postés
3
Date d'inscription
samedi 7 août 2010
Statut
Membre
Dernière intervention
10 juillet 2013
-
Bonjour,
Pourriez vous m'aider sur le code ci dessous?
J'aimerais savoir pourquoi au chargement de ma page, la variable obj.style.zIndex n'est pas correctement initialisée?





<html >
<head>
<script type="text/javascript">
function traite_postit(valeur)
{
alert("div (son id) a modifier: \n" + valeur);
var obj = document.getElementById(valeur);
alert("Son z-index est de :" + obj.style.zIndex );
obj.style.zIndex=920;
alert('Et maintenant son z-index contient : "'+obj.style.zIndex+'"');
}
</script>

<style type="text/css">
#un
{
position:absolute;
width:300px;
height:100px;
background-color : red;
z-index:600;
}
#deux
{
position:absolute;
width:300px;
height:100px;
margin-top:60px;
background-color : green;
z-index:500;
}
</style>



</head>






DIV "UN" :bobo est pas content Cliquer ici pour modifier le div "Deux"




DIV "DEUX": bobo est content maintenant





</html>


La syntaxe suivante fonctionne:



Mais je voudrait séparer mon code css de mon code html.
(ici je l'ai mis dans un seul fichier pour plus de facilité).

Merci.

3 réponses

Messages postés
1769
Date d'inscription
vendredi 9 mai 2008
Statut
Modérateur
Dernière intervention
23 octobre 2020
105
bonjour

le probleme vient du fait que l'on ne peut pas utiliser style pour lire dans le css quand celui ci est separé du code il faut utiliser currentStyle pour ie <9 et pour les autres navigateurs getComputedStyle

var obj = document.getElementById(valeur);

var zidex=(typeof window.addEventListener == 'undefined') ? obj.currentStyle.zIndex : getComputedStyle(obj, null).getPropertyValue('z-index');

alert("Son z-index est de :" + zidex ); 
Messages postés
3
Date d'inscription
samedi 7 août 2010
Statut
Membre
Dernière intervention
10 juillet 2013

Bon je m'auto répond:
J'ai vue dans le lien suivant (http://www.quirksmode.org/dom/w3c_css.html#t02) que c'est une réaction normale.
".style" ne peut accéder qu'aux définition "inline" du css.
Messages postés
3
Date d'inscription
samedi 7 août 2010
Statut
Membre
Dernière intervention
10 juillet 2013

Merci pour la réponse (que je n'attendais pas aussi rapide ).

Effectivement, mais style est accepté par tout les navigateurs (toujours selon mon lien ci dessus).
Donc, je vais faire une petite entorse a ma façon de programmer et mettre mon css en dans mon code.

Merci encore