top of page

Create Your First Project

Start adding your projects to your portfolio. Click on "Manage Projects" to get started

Ping Ball

Date

October 2023

Location

Arlington Texas

This project is a JavaScript-based soccer ball animation where users can control the animation speed and the number of bouncing balls on a virtual court. The HTML file sets up a webpage with options to choose animation speed and the number of balls. The JavaScript code initializes the animation, handles user input, and manages the physics of ball movement, collision, and rebound within the specified court boundaries. The animation creates a visually engaging experience with bouncing soccer balls, and users can toggle the animation on and off. The project combines HTML, CSS, and JavaScript to deliver an interactive and dynamic soccer ball simulation.

Getting Started: Clone the repository to your local machine. Open the index.html file in a web browser.

Usage: Adjust animation speed using the provided radio buttons for slow, medium, or fast. Choose the number of balls with the dropdown menu. Click on the court to toggle between animation suspension and resumption.

Code Structure: The HTML file (index.html) sets up the webpage structure. CSS styles for the soccer ball and court are defined in the <style> section. The JavaScript file (soccer.js) manages animation initialization, user input, and ball physics

bottom of page