Simple Tailwind CSS Load Screen

harzard · 2023-02-10T23:48:31.206Z

Instalation

Download fivem-loading
Extract and copy to the resources folder
Add to the server.cfg ensure fivem-loading
Edit HTML and JS files as you wish
Replace dist/assets/logo.png
Replace dist/assets/music.mp3

Features

Reproduces YouTube embedded video
Reproduces audio source
Keybind Tips Window
Animated Logo
Volume Ranger Slider

Controls

Spacebar: Pause/Play music
Arrow Left/Right: Previous/Next Keybind Tip
Arrow Up/Down: Volume Control
Mouse Wheel: Volume Control
Escape: Hide/Show Keybind Tips Window

Preview: Streamable
Download: Github

Note: This was a learning project; I’m not a developer. And I am not fluent in the English language. So, if there are any errors in the description above or in the code, my apologies.


Code is accessible	Yes
Subscription-based	No
Lines (approximately)	200
Requirements	N/A
Support	Yes

CapixabaGames · 2023-02-11T00:19:54.862Z

nice, very good.

LegacysMaps · 2023-02-11T09:52:29.236Z

An idea. Possibility to have more than one song queued up next to volume slider so someone can change the song they want during loading. Or is the volume tied into the video sound itself?

harzard · 2023-02-17T15:57:11.630Z

Tailwind CSS Load Screen V2 - FiveM Resource Development & Modding / Releases - Cfx.re Community

Toxo · 2023-08-07T07:09:01.775Z

How can i delete the menu on the loading screen? I dont want it but want that the keybindings still work

harzard · 2023-08-14T17:54:26.772Z

You can use this version without keybind tips menu: Release v0.9 · 0wn1/fivem-loading (github.com)