/javascript-game-development-css-amimation

Small example showing how you can make game sprite animations using CSS with Javascript movement.

Primary LanguageJavaScriptMIT LicenseMIT

Hi there, I'm Björn Hjorth 👋

I like combining the web and game development, if you like what you see please do not be a stranger and say "Hi" on Twitter @colorsofcode

Edit Demo on StackBlitz⚡️ · Report Bug

Logo

About The Project

Small example showing how you can make game sprite animations using CSS with Javascript movement.

All of the game logic happens in the game.js file.

All of the CSS animation (exept states) is in the duck/duck.styles.css

You use keyboard A W S D navigation to move around

PS. the images are hosted on firebase to make the demo work on StackBlitz

Prerequisites

  • Node
  • Npm

Getting started

  1. Clone the repo 
    git clone https://github.com/colorsofcode/javascript-game-development-css-amimation.git
  2. Move to the new directory 
    cd javascript-game-development-css-amimation
  3. Install development dependencies 
    npm install
  4. Start up the development environment 
    npm run dev

Contact

Björn Hjorth - @colorsofcode

Homepage: https://colorsofcode.com

License

Distributed under the MIT License. See LICENSE for more information.

Acknowledgments

To all the indiedevs that I have connected with over the years.