JavascriptProva

martedì 17 gennaio 2012

Le palle si fermano una per una.

HAH!!!! Sono riuscito a realizzare il fatto che passandoci sopra con il mouse si fermano!

GRANDIOSO!!!
<script>
function oggetto(nome){
  var MioNome=nome;
 
 var Sinistra=Number((document.getElementById(MioNome).style.left).replace("px",""));
 var Alto=Number((document.getElementById(MioNome).style.top).replace("px",""));
 var Larghezza=Number((document.getElementById(MioNome).style.width).replace("px",""));
 var Altezza=Number((document.getElementById(MioNome).style.height).replace("px",""));
 var intX=1;
 var intY=1;
 var Intervallo;
  this.step=function(){
  
  if((Sinistra>900)||(Sinistra<0))
   intX=-intX
  if((Alto>600)||(Alto<0))
   intY=-intY
    Sinistra+=intX
  Alto+=intY
    document.getElementById(MioNome).style.left=Sinistra;
  document.getElementById(MioNome).style.top=Alto;
  }
 
 this.muovi=function(){
  clearInterval(Intervallo);
  Intervallo=window.setInterval(function(oggetto){oggetto.step()},20,this);
 }
 this.inter=function(){
  clearInterval(Intervallo);
 }
  
}
function crea(){
  for(var n=0;n<document.getElementsByTagName("img").length;n++)
   {
    var DivId=document.getElementsByTagName("img")[n].id;
    window[DivId] = new oggetto(DivId);
   }
 
}


function clic(e){
 
  window[e.currentTarget.id].muovi();
}

function over(e){
 window[e.currentTarget.id].inter();
}


</script>
<body onLoad="crea();">
<img id="ciccio" style="width:50px;height:50px;position:absolute;top:0px" src="pallone.gif" onClick="clic(event)" onMouseOver="over(event)">
<img id="pippo" style="width:50px;height:50px;position:absolute;top:100px" src="pallone.gif" onClick="clic(event)" onMouseOver="over(event)">
<img id="mimmo" style="width:50px;height:50px;position:absolute;top:200px" src="pallone.gif" onClick="clic(event)" onMouseOver="over(event)">
</body>
...con l'aggiunta del codice scritto in rosso.

Nessun commento:

Posta un commento