https://github.com/satyam-software-developer/ping-pong-game

ping pong game created with html, css and javascript for frontend web development.
https://github.com/satyam-software-developer/ping-pong-game

css git github html javascript

Last synced: 16 days ago
JSON representation

ping pong game created with html, css and javascript for frontend web development.

• Host: GitHub
• URL: https://github.com/satyam-software-developer/ping-pong-game
• Owner: satyam-software-developer
• Created: 2023-11-26T17:12:03.000Z (about 1 year ago)
• Default Branch: main
• Last Pushed: 2024-12-16T15:17:13.000Z (19 days ago)
• Last Synced: 2024-12-16T16:27:33.689Z (19 days ago)
• Topics: css, git, github, html, javascript
• Language: JavaScript
• Homepage: https://satyam-software-developer.github.io/Ping-Pong-Game/
• Size: 10.7 KB
• Stars: 1
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
# Ping Pong Game

A simple Ping Pong game built using HTML, CSS, and JavaScript. This is a classic two-player game where you control paddles and try to score points by hitting the ball past the opponent's paddle.

# Description

This project is a browser-based Ping Pong game, where two players can control paddles and attempt to score by bouncing the ball back and forth. The game tracks the score for each player and announces a winner when the score limit is reached. It features smooth animations, keyboard controls, and simple game logic.

# Features

1. Two-Player Gameplay:

 - Player 1 uses the W and S keys to move their paddle up and down.

 - Player 2 uses the Arrow Up and Arrow Down keys to move their paddle up and down.

2. Scoring System:

 - Players score a point when the opponent misses the ball.

 - Score is displayed at the top of the screen.

3. Game Reset:

 - After a player reaches the winning score, the game automatically resets.

4. Smooth Animations:

 - The ball bounces smoothly across the screen, creating a realistic game experience.

5. Responsive Design:

 - The game works on various screen sizes (desktop and mobile).

# Technologies Used

1. HTML:

  - Structure of the game (gameboard, paddles, ball, score display).

2. CSS:

  - Styling for paddles, ball, background, and UI elements.

3. JavaScript:

 - Game logic for movement, collision detection, scoring, and game resetting.

# How to Play

1. Open the game in your browser.

2. Player 1 controls the left paddle with the W (up) and S (down) keys.

3. Player 2 controls the right paddle with the Arrow Up (up) and Arrow Down (down) keys.

4. The objective is to hit the ball with your paddle and prevent it from passing by. Score a point when your opponent misses the ball.

5. When a player reaches the winning score (usually 10 points), the game resets automatically.

6. The game ends when a player wins. You can then start a new game by pressing a button.

# Folder Structure

ping-pong-game/

├── index.html           // Main HTML file

├── styles.css           // CSS file for styling

├── script.js            // JavaScript file for game logic

└── README.md            // Project documentation

# How to Run the Project

 1. Download or clone the repository:

    git clone https://github.com/satyam-software-developer/Ping-Pong-Game.git

 2. Open the index.html file in any modern browser (e.g., Chrome, Firefox, Edge).

 3. Start playing the game!

# Future Improvements

 - Add a single-player mode where you can play against the AI.

 - Improve paddle movement with smooth transitions and animations.

 - Add sound effects when the ball bounces or a player scores a point.

 - Display a message or animation for the winner after the game ends.

# Contributing

Feel free to fork the repository, make changes, and submit a pull request. Contributions are always welcome!

# License

This project is open source and available under the MIT License.

# Demo

 https://satyam-software-developer.github.io/Ping-Pong-Game/

# Author

Developed by Satyam Kumar