svg-preloader v1.0.7

Preloader

Install dependencies

npm install svg-preloader

Normal preloader:

File preloader:

Sample call:

var preloader = new Preloader();
preloader.set(DOMElement); - DOMElement - required parameter after installing preloader on it hung style position: relative

Remove preloader:

preloader.clear(DOMElement, [result]); *result - true/false

Normal preloader *result:

Optional options:

• color - line color (default: #7c7c7c)
• background - the background color (default: 1)
• opacity - transparency background (default: 1)
• size - preloader size (default: 38, min: 5)
• resize - preloader size varies depending on the size of window, convenient for mobile devices (default: false)
• width - line width (default: 3, min: 1, max: 5)
• timeout - time delay before removing the preloader, if you have the option "result" in removing (default: 1500)
• onClick - click on preloader function (default: false)
• file - preloader download files with progress bar (default: false)
• fileUploadBG - the background color of the preloader file downloads (default: none)
• fileStrokeWidth - (default: 1)
• fileStrokeColor - (default: "#ffffff")

Example:

var options = {
    color: '#ffffff',
    background: '#0080cc',
    opacity: '0.5',
    size: 100,
    width: 5,
    timeout: 3000,
    onClick: function(){alert('hi')}
};

var preloader = new Preloader(options);
preloader.set(document.body);

Example preloader file downloads:

function cancelUpload(){
    console.log('cancel upload');
    if(preloader) preloader.clear(document.body);
}
var options = {
    onClick: cancelUpload,
    file: true,
    color: '#0080cc'
};

var preloader = new Preloader(options);
preloader.set(document.body);

var proc = 0;
var interval = setInterval(function(){
    proc = proc+10;
    preloader.progress(document.body, proc);
    if(proc == 100)clearInterval(interval);

}, 300);