Super Mario Game

A web-based Super Mario platformer game created using HTML5 Canvas, CSS, and JavaScript. This game recreates the classic Super Mario experience in a browser, featuring platform jumping, coin collection, and enemy encounters.

Game Features

• Classic Mario-style platformer gameplay
• Coin collection system with score tracking
• Enemy interactions: jump on enemies to defeat them
• Lives system (3 lives)
• 100-second timer
• Mobile-friendly controls
• Responsive design for various screen sizes
• Game pause functionality
• Background music toggle

How to Play

1. Use arrow keys to navigate Mario through the world:
   • Left/Right arrows to move
   • Up arrow to jump
2. Mobile users can use the on-screen controls
3. Collect coins to earn 50 points each
4. Jump on enemies to defeat them and earn 100 points
5. Avoid falling off platforms and colliding with enemies
6. Complete the level before time runs out

Controls

• Arrow keys for movement (desktop)
• On-screen buttons (mobile)
• ESC key to pause game
• Enter to restart after game over

Technologies Used

• HTML5 Canvas for game rendering
• CSS3 for styling and animations
• Vanilla JavaScript for game logic
• Responsive design for cross-device compatibility

Resources Used

Audio

• Mario Jump Sound: MyInstants
• Background Music: Classic Mario Theme and Coin Collection Sound: Classic Mario Coin Sound all from https://www.myinstants.com/en/search/?name=Super+Mario

Images

• Background Wallpaper: DeviantArt by RubyChu96
• Sprite Images: Mario character sprites, enemies, and coins
• Game Icon: Classic Mario icon

Project Structure

Super-Mario-master/ ├── index.html # Welcome/instructions screen ├── mario.html # Main game screen ├── script.js # Game logic and functionality ├── style.css # Styling for both screens ├── README.md # This file ├── audio/ # Game audio files │ ├── coin.mp3 # Coin collection sound │ ├── jump.mp3 # Jump sound effect │ └── mariotheme.mp3 # Background music └── images/ # Game images ├── bg.jpg # Background image ├── bg.webp # WebP version of background ├── coin.png # Coin sprite ├── enemy.png # Enemy sprite ├── icon.png # Game icon ├── runleft.png # Mario running left ├── runright.png # Mario running right ├── standleft.png # Mario standing left └── standright.png # Mario standing right

Credits

Game developed by Vivek W.

All game assets are used for educational purposes only. Mario character and related elements are property of Nintendo.

License

This project is created for educational purposes and personal use only.