19-05-07

Ronddraaiende tekst op je blog

Een origineel effect op je blog is dit van een ronddraaiende tekst (op een vaste plaats). Kijk voor een voorbeeld maar eens op http://mijntestblogje.skynetblogs.be (linksboven)

Je kan natuurlijk zelf de tekst, plaats en kleur veranderen!

Ook nu weer het volledige script kopiëren en in een vakje 'Vrije Tekst' (Personalisering) plakken!

<script>
 var defaultString="welkom";

 parentID="area";
   

 vala=160;
 valc=255;

 fontsize=40;  
 posleft=400;  
 postop=150;  

 function q1() {

  for(i=0;i<5;i++) {

   node=document.getElementById(parentID);

   beforediv=document.createElement("DIV");

   cc1=255*(i/11);
   cc2=160*(i/11);
      gfx1=parseInt(vala-cc2);
      gfx2=parseInt(valc-cc1);

   str="position:absolute;top:"+postop+"px;left:"+posleft+"px;color:rgb("+gfx1+","+gfx1+","+gfx2+");width:260px;height:100px;font-size:"+fontsize+"pt;";

   if (navigator.userAgent.indexOf("Gecko")>-1)
    beforediv.setAttribute("style",str);
   else
    beforediv.style.cssText = str;
   
   beforediv.setAttribute("id","object"+i);
 
   newText=document.createTextNode(defaultString);
  
   beforediv.appendChild(newText);

   node.appendChild(beforediv);

   fontsize+=2;
   posleft+=5;
   postop-=(3-((i/20)*2));
  }

  setTimeout("animate()",100); 
 }

 ox=100;
 oy=100;
 pi=3.141516*2;
 ccounter=0;
 ww=1;

 function animate() {
  ww+=.1;  
  ccounter++; 
  if(ccounter<350) {

   for(i=0;i<5;i++) {

    pis=pi*(ccounter/70)*(i/5);
    posx=ox-20+(Math.cos(pis)*20);
    posy=oy-20+(Math.sin(pis)*20);

    document.getElementById("object"+i).style.left=posx+"px";
    document.getElementById("object"+i).style.top=posy+"px";
   }
   setTimeout("animate()",30);
  }
  else {
   ccounter=0;
   setTimeout("animate()",30);
  }
 }

</script>
<body onload="q1()"  >
<div id="area" >
</div>