Vanilla JavaScript Library to Load Animations in Favicon | favloader

loading-indicator-favloader

favloader is a Vanilla JavaScript library to load favorite icon animations that play when the tab is inactive. The Fav Loader is a JS plugin that replaces the preferred code with a customizable uploader when needed. They can be used to indicate the state of the page when something is loaded into the document.

loading favicon, animated favicon, favicon gif, animated favicon, animated svg favicon, animated favicon examples, gradient favicon

Why This Library

The primary solution for canvas animation that doesn’t work out of the box due to limited timer functionality in browsers’ main chat thread. The library uses a web agent to create a timer that won’t stop when the tab is not focused.

You can use this library if you have a math that takes a long time and people are switching tabs and you want to be notified when the app is done with everything it was doing.

How to make use of it:

Download and insert the favloader.js script into the doc.

<script src="favloader.js"></script>

Initialize the plugin.

favloader.init();

The JavaScript to show/hide the loading spinner.

favloader.start();

favloader.stop();

Customize the color of the loading spinner.

favloader.init({
  color: '#0F60A8'
});

Customize the stroke width of the loading spinner.

favloader.init({
  line_width: 2
});

Customize the size of the favicon.

favloader.init({
  favicon_size: 16
});

Customize the duration of the animation.

favloader.init({
  duration: 5000
});

The library additionally helps GIF favicon.

favloader.init({
  gif: 'loader.gif'
});

Replace Favicon With A Loading Indicator In The Browser Tab, favloader Plugin/Github


See Demo And Download

Official Website(jcubic): Click Here

This superior jQuery/javascript plugin is developed by jcubic. For extra Advanced Usages, please go to the official website.