Discussion :

[renaud26]

Bonjour � tous,

Je rame lamentablement, malgr� des tas de recherche. Je voudrais afficher les coords X et Y d'un layer draggable sur une image dans des champs texte nomm�s X et Y. Voici comment j'ai fait, mais les coordonn�es sont fausses...

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
16
17
18
19
20
21
22
23
24
25
26
27
28
 
 
function twPositionRelative(evt) {
var nOffsetX;
var nOffsetY;
evt = (evt) ? evt : ((window.event) ? window.event : "");
if (evt) {
if (document.all) {
nOffsetX = evt.offsetX;
nOffsetY = evt.offsetY;
} else if (document.getElementById) {
nOffsetX = evt.pageX - document.getElementById("monID").offsetLeft;
nOffsetY = evt.pageY - document.getElementById("monID").offsetTop;
}
//monID est le calque draggable dont je veux les coordonnées
 
  document.all.X1.innerText = nOffsetX; //input X
  document.all.Y1.innerText = nOffsetY; //input Y
 
}
}
 
function twInit() {
var oImage = document.getElementById("image")//le calque de l'image
if (oImage) {
oImage.onmousemove = twPositionRelative;
}
}

la fonction twInit() se charge avec body
les 2 inputs text X et Y sont ok: les coords s'affichent bien, mais erron�es

les layers :

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

1
2
3
4
5
6
7
 
<img src="image.gif" width="468" height="60" id="image">
<div id="monID" class="zone">TEXTE</div>
<script type="text/javascript" language="javascript">
document.getElementById("monID").style.cursor = 'move';
new Draggable('monID',{}); 
</script>

Vous voyez ce qui cloche ?
Je veux bien un coup de main...merci !

[FremyCompany]

pk ne pas utiliser this.offsetTop/offsetLeft ?

[renaud26]

Ben en faisant �a, c'est ce que je pensais faire...

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

1
2
3
4
 
 
nOffsetX = evt.pageX - document.getElementById("monID").offsetLeft;
nOffsetY = evt.pageY - document.getElementById("monID").offsetTop;

Non ?

[Sergejack]

Elles sont �ronn�es comment tes valeurs ?

Si tu les calcules apr�s le d�placement, les offest sont les valeurs � afficher et non pas mouseX - offsetLeft et mouseY - offsetTop (qui te dooneront alors forcement des valeurs constantes).

PS : Les offset peuvent avoir a �tre calculer en fonction des conteneurs anc�tres.

[renaud26]

pas facile � dire comment les valeurs sont erron�es...
Et oui, je veux que le user puisse d�placer le layer sur l'image, puis lorsque il l�che le bouton de la souris, cela "fige" X et Y dans les inputs...

[FremyCompany]

pageX n'est pas reconnu par tous les navigateurs.... si ?