This random Gizmo the Cat website was inspired by a cat called Gizmo, and Find the Invisible Cow. It was made just for fun.
Open index.html
with a live server.
Deployed using Netlify.
- Background:
id=canvas
div inindex.html
is used to place Gizmo - Gizmo: Gizmo is placed randomly on the canvas using
index.js
- Torch:
id=mask
div inindex.html
is what makes the screen dark (or coloured black). The torch is styled inmain.css
and it's position is defined by--pointer-x-percent
and--pointer-y-percent
CSS variables.index.js
updates the CSS position variables using mouse/pointer events. - Scores:
class=score
div inindex.html
is for the counting how many times Gizmo is found.index.js
updates the score.