[javascript] connaitre la position d'un objet
blbg
Messages postés
302
Statut
Membre
-
juanou -
juanou -
bonsoir,
je voudrais savoir s'il existe en javascript une fonction, méthode, ... qui retourne la position ( par rapport à l'écran ) d'un objet ???
ou qqe chose dans le ce gout là ..
& si possible savoir un peu comment ça fonctionne, ... ( ske ça retourne, .. )
merci !!!
++ blbg
*******************************
En cour de création certe, ... mais trés util !! Pour tout
savoir sur PRIZEE : " http://toutsurprizee.free.fr "
je voudrais savoir s'il existe en javascript une fonction, méthode, ... qui retourne la position ( par rapport à l'écran ) d'un objet ???
ou qqe chose dans le ce gout là ..
& si possible savoir un peu comment ça fonctionne, ... ( ske ça retourne, .. )
merci !!!
++ blbg
*******************************
En cour de création certe, ... mais trés util !! Pour tout
savoir sur PRIZEE : " http://toutsurprizee.free.fr "
A voir également:
- [javascript] connaitre la position d'un objet
- Ma position - Guide
- Suivi position google - Guide
- Connaitre sa position google - Guide
- Connaitre sa position sur google - Guide
- Position whatsapp - Guide
2 réponses
Salut,
tu peux trouver la position avec les méthodes offsetTop et offsetLeft d'un objet HTML (sur firefox). cela te donne le coin en haut à gauche de l'objet.
Pour la taille :
var divHeight;
var obj = document.getElementById('id_element');
if(obj.offsetHeight) {divHeight=obj.offsetHeight;}
else if(obj.style.pixelHeight){divHeight=obj.style.pixelHeight;}
alors je n'ai pas testé mais j'imagine que pour la position :
var divTop;
var obj = document.getElementById('id_element');
if(obj.offsetTop) {divTopt=obj.offsetTop;}
else if(obj.style.pixelTop){divTop=obj.style.pixelTop;}
et pareil pour Left...
tu peux trouver la position avec les méthodes offsetTop et offsetLeft d'un objet HTML (sur firefox). cela te donne le coin en haut à gauche de l'objet.
Pour la taille :
var divHeight;
var obj = document.getElementById('id_element');
if(obj.offsetHeight) {divHeight=obj.offsetHeight;}
else if(obj.style.pixelHeight){divHeight=obj.style.pixelHeight;}
alors je n'ai pas testé mais j'imagine que pour la position :
var divTop;
var obj = document.getElementById('id_element');
if(obj.offsetTop) {divTopt=obj.offsetTop;}
else if(obj.style.pixelTop){divTop=obj.style.pixelTop;}
et pareil pour Left...
Salut !
Personnellement, j'ai une solution de secours.
Les types de mesure diffère entre naviguateurs (et si l'on tient compte aussi des différentes tailles d'écran ...), comment faire alors pour avoir une solution parfaite ?
Voici les fonctions qui te permettent de récupérer les dimensions de ton objet :
document.getElementById("ton_objet").clientWidth
document.getElementById("ton_objet").clientHeight
auquel tu ajoute ces fontions qui te retourne les dimensions de la page utilisé :
document.body.clientWidth
document.body.clientHeight
Et avec ça j'arrive toujours à retrouver la dimension voulu avec un petit calcul.
Savoir ce que ça retourne ? Pour moi ce sont des réels, mais je ne vois pas vraiment de typage en JS ^^
Comment ça fonctionne ? Ben tu le met dans ton code et ça roule. Je peux pas t'expliquer grand chose de plus.
document.getElementById("ton_objet") te donne ton élément, et clientWidth seulement la largeur de l'élément.
Si ça peut t'aider, voila tout ;)
Personnellement, j'ai une solution de secours.
Les types de mesure diffère entre naviguateurs (et si l'on tient compte aussi des différentes tailles d'écran ...), comment faire alors pour avoir une solution parfaite ?
Voici les fonctions qui te permettent de récupérer les dimensions de ton objet :
document.getElementById("ton_objet").clientWidth
document.getElementById("ton_objet").clientHeight
auquel tu ajoute ces fontions qui te retourne les dimensions de la page utilisé :
document.body.clientWidth
document.body.clientHeight
Et avec ça j'arrive toujours à retrouver la dimension voulu avec un petit calcul.
Savoir ce que ça retourne ? Pour moi ce sont des réels, mais je ne vois pas vraiment de typage en JS ^^
Comment ça fonctionne ? Ben tu le met dans ton code et ça roule. Je peux pas t'expliquer grand chose de plus.
document.getElementById("ton_objet") te donne ton élément, et clientWidth seulement la largeur de l'élément.
Si ça peut t'aider, voila tout ;)
Tous les navigateurs ne donnent pas la même chose pour offsetTop : certain donnent la position par rapport au document, et d'autres par rapport à l'objet parent.
Il faut ruser plus que ça pour avoir une solution réellement compatible.
Vois donc avec ce script, qui marche normalement sur tout navigateur :
https://reactdom.com/restful-api/