html5螺旋动画特效

var canvas = document.getElementById('Canvas_One'); var context = canvas.getContext('2d'); var i=0;j=0.2;var l=-1;var k;k="3.1415926535897932384626433832795028841971693993751058209749445923078164062862089986280348253421170679821480865132823066470938446095505822317253594081284811174502841027019385211055596446229489549303819644288109756659334461284756482337867831652712019091456485669234603486104543266482"; function timing() { l=l+1; i=i+j;var r=20*Math.pow(i,0.5);//context.clearRect(0,0,400,300); //var r=Math.pow(10000*Math.cos(2*i),0.5);context.beginPath();context.moveTo(200,150);var x=200+r*Math.sin(i); var y=150+r*Math.cos(i);context.font="14px Georgia";context.textAlign='center';context.fillText(k.substr(l,1),x,y);context.fillStyle='green';context.lineTo(x,y);context.strokeStyle='rgba(255,255,0,0.2)';context.shadowColor='rgba(255,255,0,0.5)';context.shadwoOffsetX=10;context.shadowOffsetY=10;context.shadowBlur=20;context.stroke(); if(l>260){j=-0.2;l=-1;context.clearRect(0,0,400,300);}if(i<-0.2){j=0.2;context.clearRect(0,0,400,300);} } window.setInterval('timing()',90);

在线演示        积分下载        6毛下载        砍两刀下载