Coordinate all'interno di un div....

**henry78** · 23-05-2008, 16:08

Ciao a tutti

domanda non proprio easy...
Se ho un div largo e lungo 500px... c'e' un modo per conoscere le coordinate (x,y) nel quale si trova il puntatore del mouse?

in pratica, dovrei creare un livello che contiene l'immagine dell'italia
l'utente dovrebbe potere trascinare una icona sulla cartina, e dovrei memorizzare la posizione...

Mi sapete aiutare?

**henry78** · 23-05-2008, 17:01

questo codice, restituisce le coordinate nella pagina:

var x=event.x; //Cordinata X del Mouse
var y=event.y; //Cordinata Y del Mouse
var doc=document.getElementById(id);
doc.style.left=x;
doc.style.top=y;

è possibile modificarlo per restituire le coordinate di una un DIV ??

**br1** · 23-05-2008, 18:26

Non mi pare che ci sia niente da modificare...

codice:

<HTML>
 <HEAD>
 <script>
 function mm(id) {
 var x=event.x; //Cordinata X del Mouse
var y=event.y; //Cordinata Y del Mouse
var doc=document.getElementById(id);
doc.style.left=x;
doc.style.top=y;
}
</script>
 </HEAD>

 <BODY>
 <div style="border:1px solid red;width:300px;height:300px;" onmousemove="mm('pippo')">[img]br1.gif[/img]</div>
 
 </BODY>
</HTML>

ciao

**henry78** · 24-05-2008, 10:17

Originariamente inviato da br1
Non mi pare che ci sia niente da modificare...

codice:

<HTML>
 <HEAD>
 <script>
 function mm(id) {
 var x=event.x; //Cordinata X del Mouse
var y=event.y; //Cordinata Y del Mouse
var doc=document.getElementById(id);
doc.style.left=x;
doc.style.top=y;
}
</script>
 </HEAD>

 <BODY>
 <div style="border:1px solid red;width:300px;height:300px;" onmousemove="mm('pippo')">[img]br1.gif[/img]</div>
 
 </BODY>
</HTML>

ciao

E no... se faccio l'alert ad esempio dell'asse y, vedo che il valore cambia a seconda di dove posiziono il DIV nella pagina web..

Ho bisogno che i valori x e y siano riferiti all'oggetto div e non quelli generali della pagina..

ma come?

**br1** · 24-05-2008, 13:23

codice:

<HTML>
 <HEAD>
 <script>
 function mm(id) {
 var x=event.x; //Cordinata X del Mouse
 var y=event.y; //Cordinata Y del Mouse
 document.getElementById("pos").value = "x="+(x)+" y="+(y);
var doc=document.getElementById(id);
doc.style.left=x;
doc.style.top=y;
}
</script>
 </HEAD>

 <BODY>
 <div style="border:1px solid red;width:300px;height:300px;position:relative;" 
  onmousemove="mm('pippo')"> [img]br1.gif[/img]</div>
 <input type="text" id="pos">
 </BODY>
</HTML>

ciao

**henry78** · 24-05-2008, 15:02

Perfetto!

solo una cosa... non funziona con firefox?

VVoVe:

**br1** · 24-05-2008, 15:25

codice:

<HTML>
 <HEAD>
 <script>
function on_MouseMove(e) {
  if (!e) var e = window.event;
  (x = e.x) ? x : e.pageX;
  (y = e.y) ? y : e.pageY;
  document.getElementById("pos").value = "x: " + x + " | y: " + y;
  }
</script>
 </HEAD>

 <BODY>
 <div style="border:1px solid red;width:300px;height:300px;position:relative;" onmousemove="on_MouseMove()" "mm('pippo')">.</div>
 <input type="text" id="pos">
 </BODY>
</HTML>

Prova questo, io qui non ho firefox.

ciao

Discussione: Coordinate all'interno di un div....

Strumenti discussione

Ricerca discussione

Visualizza

Coordinate all'interno di un div....

Permessi di invio