skeletimage

A simple script to enable a skeleton loader on your images

Usage no npm install needed!

<script type="module">
  import skeletimage from 'https://cdn.skypack.dev/skeletimage';
</script>

README

SkeletonLoader

A tiny script for adding an skeleton loader to your image.

Script size: 1.3 kB

Installation

<script src="http://cloud5828261.nitrado.cloud/skeleton.min.js"></script>

or with npm:

npm install skeletimage

How to use ?

If you installed it with npm then you need to import it and initial the script:

import skeletImageInit from "skeletimage"

Now initial:

skeletImageInit()

After loading images over AJAX you will need need to re-inital the images again with:

skeletImageInit()

Configuration

Add skeleton attribute to your <img> to enable the sekeleton loader. You will need to wrap your image in, for example, an `

:

<div style="width: 500px; height: 400px;">
   <img style="width: 100%; height: 100%" skeleton src="your/img/url />
</div>

Thats all!

Example

http://cloud5828261.nitrado.cloud/skeleton.html