Oi gente, tudo certo? Eu tinha pensado em uma resolução um pouco mais complicada do que a do Flávio (^^; E usei o 'setInterval' dentro de um 'while', segue o código:
<canvas width="600" height="400"></canvas>
<script type="text/javascript">
var tela = document.querySelector('canvas');
var pincel = tela.getContext('2d');
pincel.fillStyle = 'lightgrey';
pincel.fillRect(0, 0, 600, 400);
function desenhaCirculo(x, y, raio)
{
pincel.fillStyle = 'blue';
pincel.beginPath();
pincel.arc(x, y, raio, 0, 2 * Math.PI);
pincel.fill();
}
function limpaTela()
{
pincel.clearRect(0, 0, 600, 400);
}
var x = 20;
var ida = true;
var volta = false;
var x2 = 580;
function atualizaTela()
{
limpaTela();
desenhaCirculo(x, 20, 10);
x++;
}
function daVolta()
{
limpaTela();
desenhaCirculo(x2, 20, 10);
x2--;
}
while (ida = true)
{
setInterval(atualizaTela, 10);
if(x==580)
{
ida = false;
volta = true;
x = 20;
break;
}
}
while (volta = true)
{
setInterval(daVolta, 10);
if(x2 == 20)
{
volta = false;
ida = true;
x2 = 600;
break;
}
}
</script>
O meu código não funcionou por erros da minha parte ou é por causa de alguma propriedade do 'setInterval'?