Spostare un immagine e crearne un'altra da muovere

**Rex Romae** · 03-07-2008, 02:39

Salve a tutti ho un problemino alquanto strano vi sembrerà, cmq volevo fare in modo che quando muovi il mouse prende le cordinate x,y del mouse e le invia a una funzione che sposta a sua volta un immagine. Però volevo fare che quando spostava quella lasciava cmq l'img a quel posto.. quindi avevo pensato di creare un nuovo oggetto Image e dargli le cordinate ma nn funziona... come posso fare? grazie in anticipo a chi mi risponde!

ecco il codice nn è molto quindi ve lo metto anche x farvi capire bene!

Codice PHP:


<html>

   <head>

      <title>Mouse Tracking by Rex Romae</title>

      <script type="text/javascript" language="JavaScript">

         function tracking(x,y)

         {

            var el = document.getElementById("pixel");

            el.style.left = x + 1 + "px";

            el.style.top = y + 1 + "px";

            

            image = new Image();

            image.src = "pixel.gif";

            image.style.left = x+ "px";

            image.style.top = y+ "px";

            

         }     

      </script>

   </head>

   

   <body OnMouseMove="tracking(event.clientX,event.clientY);">

      [img]pixel.gif[/img]

   </body>

</html>

**Xinod** · 03-07-2008, 03:10

vari errori,
intanto passa event e non event.clientX e Y

nella funzione,
function blabla(e){
if(!e) e=window.event
// ...da qui in poi "e" e' l' oggetto event in tutti i browser moderni
}

poi, qui devi fare una riflessione
image = new Image();
image.src = "pixel.gif";
image.style.left = x+ "px";
image.style.top = y+ "px";

quando crei un nuovo oggetto image non fai altro che ...creare un nuovo oggetto image,
non vuol dire che magicamente apparira' nel documento
al settaggio dell' src il browser carichera' questa immagine (e' il principio del preload in javascript) ma non la mostrera'
ma tu sei sicuro di voler fare questa procedura ad ogni singolo movimento del mouse?
non e' certo l' ideale

questo vuol dire che,

Codice PHP:


// se non c'e' gia' un' immagine con un determinato id,

if(!document.getElementById('idTuaImmagine')){

  // crea un elemento con 

  var tuaImmagine=document.createElement('img');

  // settane le proprieta', lo stile e l' id

  tuaImmagine.id='idTuaImmagine';

  //etc etc

  // e appendila al documento con 

  document.body.appendChild(tuaImmagine);

}

else {

// altrimenti settane solo la posizione

}

prova a procedere cosi', se non riesci ci risentiamo

**Rex Romae** · 05-07-2008, 02:26

grazie infinite della risposta studierò il tuo codice per capirlo!

Discussione: Spostare un immagine e crearne un'altra da muovere

Strumenti discussione

Ricerca discussione

Visualizza

Spostare un immagine e crearne un'altra da muovere

Permessi di invio