flixrp / HTML-slot-machine-example

A lightweight javascript/html implementation of a slot machine

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

HTML Slot machine skeleton example

GitHub

A self-styled slot machine layout made with vanilla Javascript and HTML/CSS. It's a lightweight example of how you can do a slot machine.

This was a prototype for an in-game FiveM casino that was never completed.

It's designed to be able to calculate the result on the server and just "Show" the result for the user. This approach is the only way to prevent cheating! But you have to make some changes on your own. Currently, the result is randomized in Javascript inside the setResult() function.

Credit to piJoe's Codepen for inspiration.

Preview

Untitled.mp4

The concept behind it

The slot machine has around 40 spinning items that move down through a CSS animation. Once the reels start spinning, the first and last three items are set to the generated combination (currently client-side). The user will see the reels stop at the generated combination. Surprise!

Show your kindness

Be sure to leave a ⭐️ if you like the project :) Thank you! Contribute, if you're interested!

About

A lightweight javascript/html implementation of a slot machine

License:MIT License


Languages

Language:JavaScript 43.9%Language:CSS 40.4%Language:HTML 15.7%