Apollo Loading Screen (Css, HTML, JavaScript) v0.1.1

FiveM Releases
1

asdasd
asdasd1276×630 79.8 KB

Apollos Loading Screen

v0.1.1

This resource is a simple clean loading screen for FiveM. You can control the music volume aswell as pause and play the music.

Github: https://github.com/Apollo0604/Apollo-Loading-Screen

Credit:

Thanks to VincentGarreau for making particles.js.

https://github.com/VincentGarreau/particles.js

To-Do

  • Make a few more versions for communitys to have some variaity If they can only drag and drop.
  • Add congigerable loadingbar
  • Add more songs

    • Installation

  • Place the loadingscreen folder and into your resources folder.
  • ensure loadingscreen in a cfg file that is being executed by your server.

    • Video

    Watch short video

    https://gyazo.com/11af8904646bd2549b46f518a85f9701

    Note:

    I will try my best to give support on this release to people who deserve help. If you are being negative I will not help you. If you are being rude you will not get a response out of me. Im not here for keyboard fights so please refrain from being rude. All constructive criticism is welcome! Leave a heart if you like my work.
    This resource will be updated frequently!
6 Likes
2

Good job. Is it playing any music?

1 Like
3

Thanks. Yes it plays .ogg files.

4

good work , how do I change the color of the title of the server

5

Thank you for the kind words. To change the color open the style.css file in the root directory of the resource.
Search for h1 and replace the h1 code with the code below.
Edit the color to whatever color you want.

h1{
    font-size: 50px;
    color: blue;
}

More customization will be in the next update. :slightly_smiling_face:

1 Like
6

thank you very much

7

No problem. :slightly_smiling_face:

8

Where do I change the logo.png to logo.jpg

9

Open the index.html in the root directory of the resource and open the __resource.lua, which can also be found in the root directory of the resource.

You need to edit this line of html in the index.html file.

<div id="logo">
        <img src="https://i.imgur.com/qPYd8fa.png" alt="display this" width=200 height=200> <!-- Change the pic size here-->
    </div>

You will need to also edit this line in the __resource.lua file. changing the .jpg to .png.

files{
    "index.html",
    "app.js",
    "image1.jpg",
    "particles.js",
    "style.css",
    "music/music.ogg",
}
10

Thank you sir, great job!!

12

how to I get the background image to fit the whole screen the bottom inch is clouds?

13

maybe add auto changing background image with some fading effects

1 Like
14

how do i take out the " loading apollo space station "?

15

Remove line 25

16

Which file would I find this line 25? Also Awesome job. I love the loading screen!

17

how can i change the loading name ?

18

The download link isn’t working??

19

Hello, i want to download it from github but it say me: “404 This is not the web page you are looking for”. Please help. Thanks in advance! :grinning:

20

@Cral_Cactus https://github.com/Apollo0604/FiveM-Apollo-Loading-Screen

21

Not the same as we saw on the post