Ya estoy inscrito ¿Todavía no tienes acceso? Nuestros Planes
Ya estoy inscrito ¿Todavía no tienes acceso? Nuestros Planes
2
respuestas

SOLUCION SE VA COMPLICANDO:::

<!DOCTYPE html>

<meta charset="UTF-8" />

<html lang="es">

    <title>ANIMACIONES SIMPLES 2</title>

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

<script>

var pantalla = document.querySelector("canvas");
    var pincel = pantalla.getContext("2d");    

    pincel.fillStyle = "grey";
    pincel.fillRect(0,0,600,400); 

  function diseniarCircunferencia(x,y,radio){
        pincel.fillStyle ="blue"
        pincel.beginPath();
        pincel.arc(x,y,radio,0,2*Math.PI);
        pincel.fill();

 }

  function limpiarPantalla(){

     pincel.clearRect(0,0,600,400);
     pincel.fillStyle = "green";
     pincel.fillRect(0,0,600,400);
 }
   var x = 0;
   var y = 1;

   function actualizarPantalla(){

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

      diseniarCircunferencia(x,20,15);
      x = x + y;
   }

    setInterval(actualizarPantalla,10);

</script>
2 respuestas

Querido amigo:

Cito textualmente un aporte de Thiago Vazquez Enninger en otro post:

"Gracias por tu contribución y felicitaciones por tu aprendizaje. Estamos priorizando el foro para postear dudas, así optimizamos el tiempo de respuesta para ustedes.

Para no dejar de compartir los códigos, actividades y ejercicios que realizas, creamos un canal en Discord (#compartatucodigo) donde puedes compartirlos, dar y sugerir mejoras con el resto de tus compañeros.

Un saludo."

De igual manera, me permito ayudarte con el enlace directo del canal que menciona Thiago.

https://discord.com/channels/885135728080740392/964279865014636554

Allí puedes postear tu código, bien hecho!

Gracias por compartir tu código, es muy útil para los que iniciamos con la programación.