/splash-screen

A simple splash screen

Primary LanguageCSSMIT LicenseMIT

splash-screen

============= NPM version

A splash screen is required from end-user's perspective while developing SPA based application, cause that static resources usually concatenated into only one file in production release which might cost few seconds in loading phase.

A splash screen is great to be loaded parallel with the application part. Once the application part loaded, destroy splash-screen and display the application.

It is already used in http://www.hfworks.cn

Install via bower

bower install --save splash-screen

Install via npm

npm install --save splash-screen

Usage

Import CSS

<link rel="stylesheet" type="text/css" href="node_modules/splash-screen/dist/splash.min.css">

ES2015

import {Splash} from 'splash-screen';

CommonJS

var Splash = require('splash-screen').Splash;

Script

<script type="text/javascript" src="node_modules/splash-screen/dist/splash.min.js"></script>
<script type="text/javascript">
    var Splash = window.Splash;
</script>
Splash.enable('windcatcher'); //launch the splash-screen while needed

Splash.isRunning(); //detect if there is a splash running on the window

Splash.destroy();//destroy the splash-screen on demand

Themes

Multiple themes can be used while enable splash. Available themes: tailing, windcatcher, audio-wave, spinner-section, spinner-section-far, circular.

See full featured demo: splash-screen

LICENSE

MIT License