Skeleton Loading Screen With jQuery And CSS3 - avnSkeleton

File Size: 10.4 KB
Views Total: 13224
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
Skeleton Loading Screen With jQuery And CSS3 - avnSkeleton

avnSkeleton is a jQuery plugin used to create a customizable, CSS3 animated, Facebook inspired skeleton preview of your web content while waiting for async data.

See also:

How to use it:

1. To use this plugin, include the following JavaScript and CSS files on the web page.

<!-- Style sheet-->
<link rel="stylesheet" href="avnSkeleton.css">

<!-- JavaScript -->
<script src="" 
<script src="avnPlugin.js"></script>
<script src="avnSkeleton.js"></script>

2. Call the plugin with options on your content wrapper.

<article class="wrapper">

  // default configs
  cssPrefix: 'avn-skeleton',
  header: {
    selector: '> header',
    lines: 2,
    icon: true,
    loader: true
  main: {
    selector: '> main',
    paragraphs: 3,
    lines: 4

3. Disable the skeleton screen.


4. Show the skeleton screen.


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