A customisable loading screen. Created by using HTML, CSS & JS
Create a highly customisable loading screen for your web application by leveraging the power of HTML, CSS, and JavaScript. This loading screen is designed to be visually appealing and user-friendly, with options to easily modify its appearance to suit your brand. Utilizing HTML for structure, CSS for styling, and JavaScript for dynamic behavior, the loading screen includes customizable elements such as background color, loading animation, and text content.
-
Download the Repository:
- Visit the GitHub repository and download it as a ZIP file.
-
Extract the Files:
- Extract the contents of the ZIP file.
-
Select a Color Theme:
- Navigate to the
all_themesfolder. - Choose your desired colour theme by selecting the corresponding folder.
- Navigate to the
-
Copy Files:
- Copy the
index.html,loader.js, and the selected colour theme folder.
- Copy the
-
Paste into Your Website Directory:
- Paste the copied files and folder into your website's project directory.
-
Update CSS Link:
- Open the
index.htmlfile in a text editor. - Locate the CSS link in the
<head>section. - Update the
hrefattribute to point to the CSS file within your selected colour theme folder.
- Open the
-
Integration Complete:
- Save the changes to the
index.htmlfile.
- Save the changes to the
-
Test:
- Open the modified
index.htmlfile in a web browser to ensure the loading screen appears with the selected colour theme.
- Open the modified
all_themesbluepinkredpurple
Contributions are welcome! If you find any issues or have suggestions for improvements, feel free to open an issue or submit a pull request on GitHub.
This project is licensed under the MIT License.
If you have any questions or feedback, you can reach out to me at dangleeson13@gmail.com.