Tester si un style est appliqué sur un élément

**Kagami** · 24/06/2015, 01h47

je cherche comment faire pour appliquer un style sur un div (#all-Type) genre :
ce code ne marche pas :/

Code :

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

1
2
3
4
5
<script> 
	if( $('#all-type').css('margin-top') == '50%'){
	$("#all-type").css('position') == 'fixed');
}
	</script>

**www.diazis.com** · 24/06/2015, 10h34

Bonjour,

Voilà ce que je proposerais en javascript si #all-Type est l'id du div:

Code :

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

1
2
3
4
allType = document.getElementById('#all-Type');
if (allType.style.marginTop == '50%') {
  allType.style.position = 'fixed';
}

**SpaceFrog** · 24/06/2015, 12h57

Pour savoir pourquoi ton code ne fonctionne pas, as tu testé :

Code :

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

console.log( $('#all-type').css('margin-top') )

**Kagami** · 24/06/2015, 17h55

bonjour,
avec ce code on me donne rien sur console :

Code :

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

1
2
3
4
5
6
7
<script> 
	if( $('#all-type').css('margin-top') == '50%'){
	$("#all-type").css('position') == 'fixed';
 
  console.log( $('#all-type').css('margin-top') )
}
	</script>

mais avec le code que m'a donné diazis :

Code :

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

1
2
3
4
5
6
7
<script>  
allType = document.getElementById('#all-Type');
if (allType.style.marginTop == '50%') {
  allType.style.position = 'fixed';
   console.log( $('#all-type').css('margin-top') )
}
	</script>

ça m'affiche une sorte d'erreur :
Uncaught TypeError: Cannot read property 'style' of null

**NoSmoking** · 24/06/2015, 19h54

Bonjour,
il semblerait à première vu que tu cherches à faire appel à l'élément AVANT qu'il ne soit dans le DOM, jQuery ne déclenche pas d'erreur car il retourne un objet jQuery vide, c'est pas cool pour ceux qui débutent, mais en javascript "pur" cela engendre une exception qui plante.

Concernant la source que t'a indiqué www.diazis.com elle ne fonctionnera que si le style est mis inline, dans le cas contraire il faut passer par un window.getComputedStyle ou un oElem.currentStyle.

Maintenant parlons des 50% affecté à ta margin-top, sauf si cela est mis en inline, tu n'aura pas un retour en % mais en px, donc il va te falloir faire autrement.

**www.diazis.com** · 24/06/2015, 21h14

Es tu sur que ton div a pour id '#all-Type' ?

le code suivant affiche bien 50%

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
14
<!DOCTYPE html>
<html>
  <head>
  </head>
  <body>
    <div id="#all" style="height: 50px; width: 50px; margin-top: 50%; background-color:red;">
 
    </div>
    <script>
      temp = document.getElementById('#all');
      alert(temp.style.marginTop);
    </script>
  </body>
</html>

Tester si un style est appliqué sur un élément

jQuery

Vue hybride

Discussions similaires

Partager

Partager