Go back to homepage

Game

Rahul Jumps's cover image

OVERVIEW

A game for fun using plain HTML CSS JS

FEATURES

  • No libraries used. No gimmicks. Just plain old HTML, CSS and JS.
  • Amazing sprite animations.

PROBLEM

Challenged myself to make a platformer game without using any game engine, any frameworks or html canvas. Just plain old html, css and javascript.

SOLUTION

Achieved this by using html divs for the character sprite and the shooting blast. For the running and jumping of the sprite, css animations were used. Shooting blast divs were randomly generated at random intervals of time and appended to the document. Then calculated if the character and the blast intersects (which means the character dies) by using the getBoundingClientRect method, which returns a DOMRect object providing information about the size of an element and its position relative to the viewport.

TECH STACK

Frontend:

  • HTML
  • CSS
  • Javascript

SCREENSHOT

Rahul Jumps's 1 screenshot