Author: | quintana-dev |
---|---|
Views Total: | 910 views |
Official Page: | Go to website |
Last Update: | August 20, 2018 |
License: | MIT |
Preview:

Description:
Prelodr is a native JavaScript library (also can be used as a jQuery plugin) that helps create a Google Inbox style content preloader with async and chaining support.
Installation:
# NPM $ npm install Prelodr --save
Basic usage:
Load the following JavaScript and CSS files in your html file.
<link rel="stylesheet" href="prelodr.min.css"> <script src="prelodr.js"></script>
Show a preloader on the page.
prelodr.in('Loading...');
Dismiss the preloader.
prelodr.out();
Create a preloader on a specific element.
var prelodr = new Prelodr(document.getElementById('myContainer')); prelodr.in('Loading...');
Pass the following options as the second paramters to the Prelodr.
var prelodr = new Prelodr(document.getElementById('myContainer'),{ // Timing for show and hide transition. duration: 750, // Prefix class for prelodr. prefixClass: 'prelodr', // Callback when prelodr is shown. show: null, // Callback when prelodr is hidden. hide: null }); prelodr.in('Loading...');
API methods.
// Sets options. Prelodr.setOptions(options) // great for Async and chaining support Prelodr.out(callback function here) // The element container. Default is document.body. Prelodr.setContainer(element) // Checks if Prelodr is visible. Prelodr.isVisible()
Changelog:
08/20/2018
- v2.1.1