Z-index et javascript

Résolu
wawoum Messages postés 3 Date d'inscription samedi 7 août 2010 Statut Membre Dernière intervention 10 juillet 2013 - 10 juil. 2013 à 14:02
wawoum Messages postés 3 Date d'inscription samedi 7 août 2010 Statut Membre Dernière intervention 10 juillet 2013 - 10 juil. 2013 à 14:54
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

@karamel Messages postés 1855 Date d'inscription vendredi 9 mai 2008 Statut Modérateur Dernière intervention 18 avril 2024 153
10 juil. 2013 à 14:35
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 ); 
3
wawoum Messages postés 3 Date d'inscription samedi 7 août 2010 Statut Membre Dernière intervention 10 juillet 2013
10 juil. 2013 à 14:29
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.
0
wawoum Messages postés 3 Date d'inscription samedi 7 août 2010 Statut Membre Dernière intervention 10 juillet 2013
10 juil. 2013 à 14:54
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
0
Rejoignez-nous