Discussion :

[calitom]

Bonjour,

Existe t'il une fonction javascript permettant de recuperer les coordonnées du coin en haut à gauche d'un div ainsi que sa hauteur et sa largeur?

En fait, je cherche à contraindre un DIV draggable à ne pas dépasser les bords du DIV dans lequel il est contenu...

Donc j'ai besoin des coordonnées du coin en haut à gauche, et de celui en bas à droite (d'où besoin de sa hauteur et sa longueur)...

Merci d'avance pour votre aide.

[SpaceFrog]

une petite recherche s'impose ...
regarde dans la FAQ et les codes source ..

[calitom]

J'arrive a recuperer les coordonnes du coin en haut gauche:

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
 
getOffsetPosition = function(inID, inTYPE)
{
 var iVal = 0;
 var oObj = document.getElementById(inID);
 var sType = 'oObj.offset' + inTYPE;
 while (oObj && oObj.tagName != 'BODY') {
  iVal += eval(sType);
  oObj = oObj.offsetParent;
 }
 return iVal;
}

Il faut faire:

Code :

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

1
2
3
 
getOffsetPosition('IdDIV', 'Left')
getOffsetPosition('IdDIV', 'Top')

Mais pour la taille du div ca ne marche pas tres bien...
J'ai essayé avec ca:

Code :

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

1
2
3
 
document.getElementById("IdDIV").clientWidth
document.getElementById("IdDIV").clientHeight

Mais ca ne correspond pas à la taille du div, on dirait que ca correspond à la taille de la fenetre...
Donc comment obtenir la taille réelle d'un div?

[SpaceFrog]

offsetWidth ???

[calitom]

J'ai essayé aussi offsetWidth, et ca ne correspond pas à la taille de mon DIV...
Pour le coin en haut à gauche, ca marche niquel, le div draggable se coince dans le coin du Div père, mais pour le coin en bas a gauche, le div dépasse...

Donc les coordonnées de ce point ne correspondent pas à offsetWidth, ni à clientWidth...

[SpaceFrog]

Code :

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

computedStyle.width

?

[calitom]

J'ai fait comme ca pour la largeur ca marche:

Code :

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

1
2
 
document.getElementById("IdDIV").offsetWidth-document.getElementById("IdDIVDraggable").offsetWidth

Mais si je fais la meme logique pour la hauteur ca ne marche pas...