They See Me Rolling

Objective

The objective here was to create a basketball that would bounce around the screen and rotate. I used HTML, Javascript and SVG for this

Problem

The main issue here was figuring out how to not let the basketball fly off of the screen, and instead, change direction.

Solution

To accomplish the bouncing effect, I made it so that the basketball would bounce whenever the center of the basketball was its radius’ distance away from any edge, and making the delta x or delta y flip positive or negative value.