Customizable Javascript Animated Skeleton Loader

JS Skeleton loader is a simple but very powerful loader package built with full JavaScript that helps you create a responsive, dynamic, and customizable skeleton loader for any content you load.

skeleton loader javascript, skeleton screen loading effect, skeleton loading css, skeleton loading gif, skeleton css animation, skeleton loading examples

How to make use of it:

1. Insert the index.js into the HTML web page.

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

2. Create an empty container to position the skeleton loader.

<div id="loader"></div>

3. Create skeleton loaders as follows:

new Loader('loader').render([
    // avatar shape: round, line, drawline
    ['round'], 
    // number of text lines
    ['line*3', 
    {
      // styles
      style: [{
        borderRadius: "5px"
      }, {
        borderRadius: "5px",
        width: '60%'
      }]
    }]
    ], {
      // number of loaders
      numbers: 2,
      // global styles
      parentStyle: {
          height: "50px",
          width: "80%"
      },
      style: {
          width: "100%"
      }
    }
);

Animated Skeleton Loader, JS Skeleton loader Plugin/Github, content loading animation, facebook skeleton loading css


See Demo And Download

Official Website(amsrafid): Click Here

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

Share