Loading examples

Loaders

The Right Way - Admin Template

App loading

Basic example of loading. Can be attached to any template container.

Use predefined functions to control loading layer.

app._loading.show(container, options); show loading layer.

container - container where loading layer should be added.
options - array with custom loading layer options.
spinner - set true to add spinner icon;
dark - set true to use dark background(spinner/colors inverted);
text - string add text to your loading layer(small caption);

app._loading.hide(container); hide loading layer.

container - container where from loading layer should be removed.

example

Page container loading

example

Page aside loading

example

Content loading

example

This card loading

Options

Zero configuration

Options

With spinner

Options

With text

Options

Dark example

Examples are displayed for 2 seconds.

Page loading

Default page loading example. Can be used in case slow loading content.

app._page_loading.show(options); show page loading layer.

options - array with custom page loading options.
logo - set true to add logo;
animation - set true to add loading animation;
logoAnimate - set true or custom animation class from animate lib;
spinner - set true to add spinner;

app._page_loading.hide(); hide page loading layer.

example

Zero configuration

example

With logo

example

Logo animation

example

With spinner

example

With pulsate animation

example

Primary color

Examples are displayed for 4 seconds.

Template settings
Information

Use this panel to configure template settings and layout options.

Layout option
Backgrounds
Header options
Container
Navigation options
Sidepanel options
Content options