Doing great things...
Writing project descriptions...
Feeding the unicorns...
Collecting jobs for you...
Calculating scores...
Finding best talented people...
Fixing responsive issues...
Painting office walls...
Coffee break...
Feeding cats...
Health check...
Storage check...
Getting avatar...
Collecting project memberships...
Getting dom together...
Getting followers...
Calculating best skills...
Getting feed...
Writing title...
ok, I got it. take me to the documentation

wdtLoading - Application loading screen

INSTALLATION

Download wdtLoading from the Github and upload the files to your server.

Include wdtLoading.js, and wdtLoading.css files.

Your code should then be similar to this:

<link rel="stylesheet" type="text/css" href="wdtLoading.css">
<script type="text/javascript" src="wdtLoading.js"></script>
Install via Bower
bower install wdt-loading
Install via NPM
npm install wdt-loading

USAGE

We wrote a helper for creating noty easily. So you can use noty(properties); like this;

Returns a NOTY javascript object. (not jquery dom object, but you can access dom with this object) Also, you can give any html to "text" option

Show the loading screen
wdtLoading.start(options);
Show with options
wdtLoading.start({
    category: 'profile',
    speed: 2500
});
Close the loading screen
wdtLoading.done();
Default Options
wdtLoading.defaults = {
    category: 'default', // .wdt-loading-phrase-category[data-category="default"]
    speed   : 2000, // in millisecond
}
HTML Markup
<div class="wdt-loading-screen">
    <div class="wdt-loading-phrases">
        <div class="wdt-loading-phrase-category" data-category="default">
            <div class="wdt-loading-phrase">Doing great things...</div>
            <div class="wdt-loading-phrase">Writing project descriptions...</div>
            <div class="wdt-loading-phrase">Feeding the unicorns...</div>
            <div class="wdt-loading-phrase">Collecting jobs for you...</div>
            <div class="wdt-loading-phrase">Calculating scores...</div>
            <div class="wdt-loading-phrase">Finding best talented people...</div>
            <div class="wdt-loading-phrase">Fixing responsive issues...</div>
            <div class="wdt-loading-phrase">Painting office walls...</div>
            <div class="wdt-loading-phrase">Coffee break...</div>
            <div class="wdt-loading-phrase">Feeding cats...</div>
            <div class="wdt-loading-phrase">Health check...</div>
            <div class="wdt-loading-phrase">Storage check...</div>
        </div>
        <div class="wdt-loading-phrase-category" data-category="profile">
            <div class="wdt-loading-phrase">Getting avatar...</div>
            <div class="wdt-loading-phrase">Collecting project memberships...</div>
            <div class="wdt-loading-phrase">Getting dom together...</div>
            <div class="wdt-loading-phrase">Getting followers...</div>
            <div class="wdt-loading-phrase">Calculating best skills...</div>
            <div class="wdt-loading-phrase">Getting feed...</div>
            <div class="wdt-loading-phrase">Writing title...</div>
        </div>
    </div>
</div>