11550 sujets

JavaScript, DOM et API Web HTML5

Savoir si un élément est placé en absolute

Bonjour,

Je ne vais pas dire grand chose de plus par rapport à mon titre, mais je vais me répéter et détailler.

J'ai un div placé en absolute de cette facon :

<style>
#mondiv
{
position: absolute;
}
</style>

<div id="mondiv">
</div>

et je voudrais savoir en javascript si cet élément est placé en absolute.


S'il n'est pas en position: absolute; je voudrais lui appliquer un position: relative;

PS: je tiens à vous informer que j'ai testé ceci : if(element.style.position == "absolute") mais sans succès...car je définis mon style dans une feuille de style et non pas directement dans ma balise.
Modifié par fieldset (14 Feb 2008 - 12:05)
Salut

Tu peux utiliser cette fonction publiée sur QuirksMode

function getStyle(el,styleProp)
{
	var x = document.getElementById(el);
	if (x.currentStyle)
		var y = x.currentStyle[styleProp];
	else if (window.getComputedStyle)
		var y = document.defaultView.getComputedStyle(x,null).getPropertyValue(styleProp);
	return y;
}


Avec les limitations qu'elle comporte comme expliqué dans l'article.
Notamment pour les propriétés comme border, background, font-size ...

Mais pour la propriété "position" cela fonctionne correctement.
Modifié par dunjl (14 Feb 2008 - 12:30)
fieldset a écrit :

PS: je tiens à vous informer que j'ai testé ceci : if(element.style.position == "absolute") mais sans succès...car je définis mon style dans une feuille de style et non pas directement dans ma balise.


Ce qui devrait fonctionner... la question est le test est-il fait avant ou après l'appel à la feuille de style car ça change tout. Tu peux faire un alert(element.style.position) pour voir ce qu'il contient...
dunjl a écrit :
Salut

Tu peux utiliser cette fonction publiée sur QuirksMode

function getStyle(el,styleProp)
{
	var x = document.getElementById(el);
	if (x.currentStyle)
		var y = x.currentStyle[styleProp];
	else if (window.getComputedStyle)
		var y = document.defaultView.getComputedStyle(x,null).getPropertyValue(styleProp);
	return y;
}


Avec les limitations qu'elle comporte comme expliqué dans l'article.
Notamment pour les propriétés comme border, background, font-size ...

Mais pour la propriété "position" cela fonctionne correctement.



je vais jetter un oeil je te tiens au courant Smiley smile
EDIT: Je te remercie ! Smiley smile celà fonctionne ! Smiley smile

skywalk3r a écrit :


Ce qui devrait fonctionner... la question est le test est-il fait avant ou après l'appel à la feuille de style car ça change tout. Tu peux faire un alert(element.style.position) pour voir ce qu'il contient...


Tu es sur de ce que tu avances ? J'ai testé et retesté et ça ne fonctionne pas. Ma feuille de style est déclaré dans les balises <head> et mon javascript juste avant la balise de fermeture body. (J'ai également tenté de placer mon Js dans les head, ou jsute après la balise body, mais ça ne change rien.

Il faut se faire à l'idée que JS ne récupère que les styles définis DANS les balises body
Modifié par fieldset (14 Feb 2008 - 14:09)
fieldset a écrit :

Tu es sur de ce que tu avances ? J'ai testé et retesté et ça ne fonctionne pas. Ma feuille de style est déclaré dans les balises <head> et mon javascript juste avant la balise de fermeture body. (J'ai également tenté de placer mon Js dans les head, ou jsute après la balise body, mais ça ne change rien.


Eh bien je n'étais pas sûr donc je viens de tester : et ca marche... pas du tout!!! Désolé je suis trop habituer à utiliser mootools. D'ailleurs avec mootools : 

$('maDivEnAbsolute').getStyle('position')


fonctionne parfaitement! Et fonctionne avec toutes les propriétés car il doit encapsuler la gestion des différentes syntaxes pour les différents navigateurs.
Modérateur
bonjour,

il est probable que ton test se faisait sitot le javascript lu , et non pas une fois que ta page soit completement chargé.

je m'explique , si ton javascript est lancé avant la fin du chargement de la page html ou de la/les feuilles de style ,il est probable que , ou, les regles css ne sont pas encore chargée ou que le div n'existe pas encore.

Pour bien faire , il faut lancer ton test une fois la page complètement chargée avec window.onload histoire de t'assurer que l'ensemble du document soit complet.

Sinon , il me semble qu'il peut y avoir des difficulté dans opera lorsque les style ne sont pas dans les balises ...

GC
Sujet clos
Aller à