How To Make An Image Fall Down To The Bottom Of The Screen And Repeat? In Javascript

Viewed 106

I currently have snow listed as my falling object :

for (let i = 0; i < 100; i++) {
  snow.push(newRandomSnow("white"));
}

This lets 100 snowflakes fall from the top of the canvas all the way to the botoom, how do I make it so that when the snow touches the end of the canvas it teleports back up and falls again

1 Answers

You should change the y-coordinate of the image to 0, whenever it exceeds the limit, here canvas height. Put this in your function with animationFrame.

function fallAgain(snowObj) {
  if (snowObj.y > canvas.height) {
    snowObj.y = 0;
  }
}

Related