nov 25 2008

Movimentação de objetos usando Canvas e Javascript

  • Autor: IphoneVicious em javascript
  • Sem Comentários. Seja o primeiro a comentar.
Mais um script feito pelo Elsio Antunes, novidade né ;), agora ele simula a movimentação dos solzinhos do orkut, se colidindo e movimentando aleatoriamente em um ambiente, usando canvas, gostaria de dizer que está funcionando no IE como no Firefox, para ver o exemplo visitem http://byteblog.net/particles_bounding.htm

<html>
   <title>particles bounding</title>
<body>
   <h1>particles bounding</h1><i></i><hr>
   <div id='anim'></div>
</body>
<script>
 
particles=100;
c=[];
 
 
// gerando partículas
// um monte delas...
// cada uma com uma posição
// e com um um movimento inicial
 
for(i=0;i<particles;i++){
   var g=[
      document.createElement("img"),
 
      // posição inicial da particula
 
      Math.random()*800,
      Math.random()*480,
 
 
      // direção do movimento
 
      Math.random()*6+3,
      Math.random()*6+3,
 
   ];
 
 
   // coloca patícula na posicção inicial
 
   g[0].src="http://www.orkut.co.in/img/castro/p_pen.gif";
   document.getElementById("anim").appendChild(g[0]);
   c[i]=g;
 
}
 
 
resetAnim = setInterval(function(){
 
      for(i=0;i<particles;i++){
 
         g=c[ i];
 
 
         // partícula pensa no que fazer
         // no caso, quando bater na parede
         // inverte o sentido do movimento
 
         if(g[1]+g[3]>800||g[1]+g[3]<0){g[3]*=-1;}
         if(g[2]+g[4]>480||g[2]+g[4]<0){g[4]*=-1;}
 
 
 
         // partícula faz o movimento
 
         g[2]+=g[4];
         g[1]+=g[3];
 
 
 
         // plotando particula na nova posição
 
         g[0].style.position="absolute";
         g[0].style.left=g[1];
         g[0].style.top=g[2];
      }
 
},30)
 
 
 
 
</script>
 
 
</html>


DEIXE UM COMENTÁRIO

Subscrever

Subscreve o Blog



Publicidade

Comentários Recentes

  • shirley Balazs: Parabéns!! Informações de utilidade publica e de primeira, foi muito útil a mim.Obrigada!!
  • Jefferson Ferreira de brito: eu quero muito
  • thiago valente: Eu quero um para mim
  • Lucas martins balieiro: Eu não fiz o enem mesmo assim eu posso me inscrever no site essa é minha dúvida, só queme...
  • Francisca Marli Oliveira: quero saber quanto tenho no meu fgts

Links

Leitores Recentes

VALE O CLIQUE!

Site Seguro Ocioso

Divulgue o blog Infomaroto em seu site e tenha seu link ou banner aqui.
Blog Infomaroto