mask_meditation1
mask_meditation1
by Eshy Lavi
HTML
<div class="entry-content">
<canvas id="canvas" width="700" height="330"></canvas><!--
<button onclick='clkk()' style='display:inline-block;float:left;margin:8px;border-radius:5px;background-color:#2351cd;'>+</button><button onclick='clkk2()' style='display:inline-block;margin:8px;border-radius:5px;background-color:#2351cd;'>–</button><button onclick='clkk4()' style='display:inline-block;margin:8px;border-radius:5px;background-color:#2351cd;'>More</button><button onclick='clkk3()' style='display:inline-block;margin:8px;border-radius:5px;background-color:#2351cd;'>Less</button>-->
</div>JavaScript
function myFunction(e){MaxX= e.clientX;for (var clearer=0;clearer<N;clearer++){if (ballx[clearer]>e.clientX) ballx[clearer]=e.clientX;}
}var MaxY=230;var MaxX=2000;var MaxR=8;var MaxXOrig=MaxX;var N =4234;var g=0.09;var ballr=[];var ballx=[];var bally= [];var ballvx= [];var ballvy= [];var ballax= [];function init(){ for (var idx=0;idx<N;idx++){ballr.push(Math.floor(Math.random()*MaxR+1));ballx.push(Math.floor(Math.random()*MaxX+1));bally.push(Math.floor(Math.random()*MaxY+1));ballvx.push(Math.random()*3-1.5);ballvy.push(Math.random()*2-1);ballax.push(0);}window.requestAnimationFrame(draw);}function draw(){var ctx=document.getElementById('canvas').getContext('2d');ctx.globalCompositeOperation='destination-under';ctx.fillStyle='rgba(0,0,0,0.8)';ctx.fillRect(0,0,MaxXOrig,MaxY);ctx.fillStyle='rgba(0,153,255,0.8)';ctx.strokeStyle='rgba(0,153,255,0.4)';ctx.save();for(var ix=0;ix<N;ix++){ctx.beginPath();ballvy[ix]=ballvy[ix]+g;ballvx[ix]=ballvx[ix]+ballax[ix];bally[ix]=bally[ix]+ballvy[ix];ballx[ix]=ballx[ix]+ballvx[ix];if(bally[ix]>MaxY-1-ballr[ix]){ballvy[ix]=-ballvy[ix];bally[ix]=MaxY-1-ballr[ix];}if(ballx[ix]>MaxX-1-ballr[ix]){ballx[ix]=MaxX-ballr[ix]-1;ballvx[ix]=-ballvx[ix];}if(ballx[ix]<ballr[ix]){ballx[ix]=ballr[ix];ballvx[ix]=-ballvx[ix];}if(bally[ix]<ballr[ix]){bally[ix]=ballr[ix];}ctx.arc(Math.floor(ballx[ix]),Math.floor(bally[ix]),Math.floor(ballr[ix]),0,Math.PI*2,false);ctx.fill();}window.requestAnimationFrame(draw);}init();