Description
Display loading overlay easily and beautifully in your application. JS loading overlay using awesome spinner from Load Awesome. It contains 52 spinner you can choose.
js-loading-overlay alternatives and similar libraries
Based on the "Animations" category.
Alternatively, view js-loading-overlay alternatives based on common mentions on social networks and blogs.
-
animate.css
🍿 A cross-browser library of CSS animations. As easy to use as an easy thing. -
particles.js
A lightweight JavaScript library for creating particles -
GreenSock-JS
GreenSock's GSAP JavaScript animation library (including Draggable). -
Effeckt.css
A Performant Transitions and Animations Library -
barbajs
Create badass, fluid and smooth transitions between your website’s pages. -
AutoAnimate
A zero-config, drop-in animation utility that adds smooth transitions to your web app. You can use it with React, Vue, or any other JavaScript application. -
jquery.transit
Super-smooth CSS3 transformations and transitions for jQuery -
Dynamic.js
Javascript library to create physics-based animations -
bounce.js
Create beautiful CSS3 powered animations in no time. -
tsParticles
tsParticles - Easily create highly customizable JavaScript particles effects, confetti explosions and fireworks animations and use them as animated backgrounds for your website. Ready to use components available for React.js, Vue.js (2.x and 3.x), Angular, Svelte, jQuery, Preact, Inferno, Solid, Riot and Web Components. -
smoothState.js
Unobtrusive page transitions with jQuery. -
Vizzu
Library for animated data visualizations and data stories. -
Odoo
Javascript and SVG odometer effect library with motion blur -
motus
Animation library that mimics CSS keyframes when scrolling. -
particles-bg
React particles animation background component -
Scrawl-canvas Library
Responsive, interactive and more accessible HTML5 canvas elements. Scrawl-canvas is a JavaScript library designed to make using the HTML5 canvas element easier, and more fun -
shuffle-images
The Simplest Way to shuffle through images in a Creative Way -
AniX
🐿 Super easy and lightweight(<3kb) JavaScript animation library -
Scroll Btween
ScrollBtween uses scroll position of document - or any DOM element - to tween CSS values on any DOM element. -
TransitionEnd
:dizzy: TransitionEnd is an agnostic and cross-browser library to work with transitionend event. -
Tailwind Animations
Cool animations implemented with tailwindcss -
Scroll Frames
Animate sequences of still frames on any DOM element in relation with its position into the viewport. https://olivier3lanc.github.io/Scroll-Frames/
Appwrite - The open-source backend cloud platform
* Code Quality Rankings and insights are calculated and provided by Lumnify.
They vary from L1 to L5 with "L5" being the highest.
Do you think we are missing an alternative of js-loading-overlay or a related project?
README
JS Loading Overlay
Display loading overlay easily and beautifully in your application. JS loading overlay using awesome spinner from Load Awesome. It contains 52 spinner you can choose.
Features
Full page loading overlay. Able to show full page loading overlay.
Loading overlay inside container. Able to display the loading overlay inside the container
Lock scroll. Able to lock the scroll during loading overlay active.
Documentation
For detail of installation instructions, in-depth usage, please take a look at the documentation.
How To Install
NPM
npm install --save js-loading-overlay
Yarn
yarn add js-loading-overlay
Use without NPM or Yarn
import 'js-loading-overlay'
JsLoadingOverlay.show({'spinnerIcon': 'triangle-skew-spin'});
How To Use
import 'js-loading-overlay'
JsLoadingOverlay.show({'spinnerIcon': 'triangle-skew-spin'});
or
<script src="js-loading-overlay.min.js"></script>
JsLoadingOverlay.show({'spinnerIcon': 'triangle-skew-spin'});
Show loading overlay with default options
JsLoadingOverlay.show();
Show loading overlay with custom options
JsLoadingOverlay.show({
'overlayBackgroundColor': '#666666',
'overlayOpacity': 0.6,
'spinnerIcon': 'ball-atom',
'spinnerColor': '#000',
'spinnerSize': '2x',
'overlayIDName': 'overlay',
'spinnerIDName': 'spinner',
'spinnerZIndex':99999,
'overlayZIndex':99998
});
Hide Loading Overlay
JsLoadingOverlay.hide();
Changelog
Please see [CHANGELOG](CHANGELOG.md) for more information on what has changed recently.
Contributing
Please see [CONTRIBUTING](CONTRIBUTING.md) for details.
License
The MIT License (MIT). Please see [License File](LICENSE.md) for more information.
*Note that all licence references and agreements mentioned in the js-loading-overlay README section above
are relevant to that project's source code only.