Build a Frogger style arcade game in a single self-contained HTML file with inline CSS and JS. But Frog lives in a modern home, and must avoid contact with day to day objects like iPhone, computer, monitor, mini cars like tesla, Ferrari, etc. create sprites and game mechanic. If you feel html is not enough use a game engine of your choice.
Hossein P.™ HP2000C
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!DOCTYPE html> | |
| <html lang="en"> | |
| <head> | |
| <meta charset="UTF-8"> | |
| <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no"> | |
| <title>Super Platformer Adventure</title> | |
| <style> | |
| body { | |
| margin: 0; | |
| padding: 0; |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!-- | |
| Originally just an idea and excuse to test the gamepad API 🎮, this spiraled out of control a little into a multi-input maze. You can navigate trough the maze, depending on your browser/os, by: | |
| - clicking the up/down/left/rigt-buttons | |
| - the arrow keys on your keyboard | |
| - the WASD-keys on your keyboard if that is more your style | |
| - by scrolling up/down or left/right | |
| - by swiping if your device of choice has a touchscreen | |
| - by tilting your device (if your device does not reuqire special permissions for that (i.e. is an iPhone)) | |
| - by typing up(), down(), left() or right() in the console | |
| - and finally, by using a compatible gamepad, aka the original idea 🙃 |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!DOCTYPE html> | |
| <html> | |
| <head> | |
| <meta charset="utf-8"> | |
| <meta name="viewport" content="width=device-width, initial-scale=1"> | |
| <title>SNAKE GAME</title> | |
| <style> | |
| body { | |
| margin: 0; |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!-- Source code from http://apps.thecodepost.org/trex/trex.html --> | |
| <head> | |
| <script src="https://apis.google.com/js/platform.js" async defer></script> | |
| <script> | |
| function hideClass(name) { | |
| for (var elem of $(name)) elem.style.display = "none"; | |
| } | |
| var DEFAULT_WIDTH = 600, FPS = 60; | |
| var IS_HIDPI = false, IS_IOS = false, IS_MOBILE = false, IS_TOUCH_ENABLED = false; |
ICE Out; Abolish ICE
Snake is a fun game to make as it doesn't require a lot of code (less than 100 lines with all comments removed). This is a basic implementation of the snake game, but it's missing a few things intentionally and they're left as further exploration for the reader.
