Lire la valeur d'une propriété CSS par le Javascript

**boutmos** · 11/07/2008, 14h51

Bonjour,

Sur mon tag body, dans ma feuille CSS, j'ai defini une hauteur en px pour ma font.

J'ai besoin de récupérer cette valeur a l'aide d'une fonction javascript. J'ai écrit ceci :

Code :

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

1
2
3
function getFontSize() {
var defautFontSize = document.getElementsByTagName("body")[0].style.fontSize);
}

Mais si je place un alert, çà ne me retourne rien du tout... Merci

**SpaceFrog** · 11/07/2008, 14h58

essaye avec ceci

Code :

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

1
2
3
4
5
6
7
8
9
function OffsetStyle(Obj,Prop)
{
	var x = Obj;
	if (x.currentStyle)
		var y = x.currentStyle[Prop];
	else if (window.getComputedStyle)
		var y = document.defaultView.getComputedStyle(x,null).getPropertyValue(Prop);
	return y;
}

Code :

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

OffsetStyle(document.body,'fontSize')

**boutmos** · 11/07/2008, 16h25

Humm j'ai peut etre loupé quelquechose mais la fonction ne me retourne rien non plus :cryyy

**SpaceFrog** · 11/07/2008, 16h33

Comment l'implémentes tu ?

**SpaceFrog** · 11/07/2008, 16h36

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
<script type='text/javascript'>
function OffsetStyle(Obj,Prop)
{
	var x = Obj;
	if (x.currentStyle)
		var y = x.currentStyle[Prop];
	else if (window.getComputedStyle)
		var y = document.defaultView.getComputedStyle(x,null).getPropertyValue(Prop);
	return y;
}
</script>
<body>
<input type="button" onclick="alert(OffsetStyle(document.body,'fontSize'))" value='size' />
 
</body>

**boutmos** · 11/07/2008, 16h38

exactement comme tu l'as faite, j'ai mis la fonction dans mon fichier .js

puis dans une autre fonction qui est appellé sur un evenement onclick je mets ceci : (J'ai pour le moment juste fait l'appel pour voir ce qui est retourné par ta fonction)

Code :

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

1
2
3
4
5
6
7
8
 
function changerTaille(Pas)
{
 var defaultFontSize = offsetStyle(document.body,'fontSize');
 alert(defaultFontSize);
...
...
}

**SpaceFrog** · 11/07/2008, 16h39

en effet sous Firfox cela semble poser problème ...
je regarde de plus près ...

sous IE ça fonctionne

**boutmos** · 11/07/2008, 16h43

erf lol juste au meme moment je viens de me rendre compte que çà marche bien sous IE mais pas FF .... la poisse , c'est mon boss que çà va encore bien faire rire !!

Merci

**SpaceFrog** · 11/07/2008, 16h47

Bon voilà ce petit desagrément resolu ...

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
<script type='text/javascript'>
function OffsetStyle(Obj,Prop)
{
	var x = Obj;
	if (x.currentStyle){var y = x.currentStyle[Prop];}
	else if (window.getComputedStyle){	var y = window.getComputedStyle(x,null)[Prop];}
	return y;
}
</script>
<body>
<input type="button" onclick="alert(OffsetStyle(document.body,'fontSize'))" value='size' />
 
</body>
 
</html>

juste à Noter que IE retourne 12pts et FFX 14px docs méfiance
Mais on peut convertir ...

**boutmos** · 11/07/2008, 16h52

Ah super çà marche, je pense que j'aurais pu trouver car c'est vrai que sur l'affectation de variable dans le else if , j'avais vu le Prop entre parenthese alors qu'au dessus , tu le mets entre crochet...

Merci beaucoup et bon week end a vous.

**SpaceFrog** · 11/07/2008, 16h56

non les parenthèses n'ont pas amélioré le code ...

tu peux faire sans (syntaxe permissive si tu n'as qu'eun ligne d'instruction ...

ce qui a changé c'est le window.getComptuedStyle ... au lieu de document ...

Lire la valeur d'une propriété CSS par le Javascript

JavaScript

Discussions similaires

Partager

Partager