<script src="https://assets.codepen.io/3560077/CanvasAnimater.js"></script>
<canvas id="myCanvas"></canvas>
<script src="./script.js"></script>
// create a CanvasAnimater object that targets a canvas element with id='myCanvas'
let canvasAnimater = new CanvasAnimater('myCanvas');
// get the '2D' rendering canvas context
let ctx = canvasAnimater.context;
// set the canvas width and height dimensions to 300x300
canvasAnimater.size(300,300)
// center the canvas in the window
canvasAnimater.center();
// define and set a draw function that fills the entire canvas with a black rectangle
canvasAnimater.draw = function () {
let W = canvasAnimater.width;
let H = canvasAnimater.height;
ctx.fillStyle = 'black';
ctx.fillRect(0, 0, W, H);
}
// render the animation
canvasAnimater.animate();
This Pen doesn't use any external CSS resources.