jQuery Plugin To Create Fullscreen Preloading Effects - fakeLoader.js

fakeLoader.js is a lightweight jQuery plugin that helps you create an animated spinner with a fullscreen loading mask to simulate the page preloading effect.

See also:

• 10 Best Loading Spinner & Indicator jQuery Plugins
• 10 Best Loading Spinner/Indicator JavaScript & CSS Libraries
• 80+ Best Pure CSS Loading Spinners For Front-end Developers

How to use it:

1. Include jQuery library and the jQuery fakeloader plugin's Javascript & CSS in the document.

<link rel="stylesheet" href="css/fakeLoader.css">

<script src="//code.jquery.com/jquery-2.1.1.min.js"></script>
<script src="js/fakeLoader.min.js"></script>

2. Create an DIV element for the loading spinner.

<div class="fakeloader"></div>

3. Call the plugin on the DIV element to show a fullscreen loading spinner when page loads.

$(".fakeloader").fakeLoader();

4. Available options.

$(".fakeloader").fakeLoader({

// Time in milliseconds for fakeLoader disappear
timeToHide:1200, 

// 'spinner1', 'spinner2', 'spinner3', 'spinner4', 'spinner5', 'spinner6', 'spinner7' 
spinner:"spinner1",//Options: 

// Background color. Hex, RGB or RGBA colors
bgColor:"#2ecc71",

// Custom loading GIF.
imagePath:"yourPath/customizedImage.gif" 
            
});

Changelog:

2019-02-26

• v2.0.0

2018-12-20

• Fix Bars Appears on Top Left Corner Before Centering

About Author:

Author: João Pereira

Website: http://joaopereirawd.github.io/fakeLoader.js/

---

This awesome jQuery plugin is developed by joaopereirawd. For more Advanced Usages, please check the demo page or visit the official website.