Skip to content

avine/jquery-skeleton

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

8 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

jquery-skeleton

Show skeleton screen during asynchronous data loading

Usage

Html fragment:

<article class="wrapper">
  <header></header>
  <main></main>
</article>

jQuery plugin:

$('.wrapper').avnSkeleton({
  cssPrefix: 'avn-skeleton',
  header: {
    selector: '> header',
    lines: 2,
    icon: true,
    loader: true
  },
  main: {
    selector: '> main',
    paragraphs: 3,
    lines: 4
  }
});

Plugin methods:

// Remove the skeleton when real content is available
$('.wrapper').avnSkeleton('remove');

// Display again the skeleton
$('.wrapper').avnSkeleton('display');

Installation and build

npm install
npm run build

Open a local server

npm start

Screenshot

Skeleton screen

About

Show skeleton screen during asynchronous data loading

Topics

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

 
 
 

Contributors