https://github.com/gperretta/arcade-mini-projects

Simple arcade games collection.
https://github.com/gperretta/arcade-mini-projects

arcade-game css front-end html javascript web

Last synced: about 2 months ago
JSON representation

Simple arcade games collection.

• Host: GitHub
• URL: https://github.com/gperretta/arcade-mini-projects
• Owner: gperretta
• Created: 2023-10-21T20:58:55.000Z (over 2 years ago)
• Default Branch: main
• Last Pushed: 2023-10-22T17:38:05.000Z (over 2 years ago)
• Last Synced: 2025-10-16T22:19:25.674Z (8 months ago)
• Topics: arcade-game, css, front-end, html, javascript, web
• Language: JavaScript
• Homepage:
• Size: 122 KB
• Stars: 0
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

          
Arcade - HTML/CSS/Javascript mini-projects
 


Running Duck



    First arcade game: infinite runner.


    What happens when you're a duck trying to avoid a buoy that's floating right in your direction? You jump!






    The game area is structured as a grid: each grid cell is a div.


    While the duck will stay floating in the same point, the buoy will move one cell at a time.


    You can avoid crashing into the obstacle by tapping the space bar and making the duck jump - thanks to the CSS transform property.


    The progress will be easily tracked with:

    


        
the score: increased by ten per each obstacled that's been avoided
 

        
the level and the speed of the buoy: both increased by one each time the score will reach a value that's a multiple of 50

     




Whack-A-Mole



    Here's a revival of the popular whack-a-mole.


    There's one easy rule: hit the mole as many times as you can until the time is up!






    The game area is a grid and each cell is a div, where the mole will appear.


    You can hit the mole by tapping on it with the cursor, just be fast: the timer is running and the mole is speeding up as well, increasing the difficulty of the game second by second.


    When a mole gets hit, your score goes up by one - and the mole will be clearly hurt.