1
resposta

Fiz desse jeito, é valido ?

<canvas width="600" height="400"></canvas>

<script>

var tela = document.querySelector('canvas');
var pincel = tela.getContext('2d');
pincel.fillStyle = 'gray';
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 sentido = 1;

var raio = 1;

function loop(){

   if( x > 600) {
         sentido = -1;
     }else if( x < 0) {
         sentido = 1;
     }

}

function pulso() {

    if( raio < 30) {
         raio++;
     }else if( raio >= 30) {
         raio = 1;
     }
}

function atualizaTela()  {

     limpaTela();

     loop();

     pulso();

     desenhaCirculo(x, 20, raio);
     x = x + sentido;

}

setInterval(atualizaTela, 20);






    </script>
1 resposta

Fala, Thiago! Tudo bem contigo?

É super válido!!!

Parabéns, meu amigo!!!

Qualquer dúvida é só nos chamar!

Um abraço e bons estudos!