Pure CSS3 Preloaders for Smoother Animation
Why Use a CSS3 Preloader?
As a result of GIF preloaders are sometimes uneven throughout heavy lifting.
And since CSS3 seems and works implausible on iOS!
- The obtain supply contains three custom-built pure CSS3 preloaders.
- Minimal markup and straightforward implementation make these preloaders helpful for nearly any mission.
- Colours and dimension are straightforward to vary.
- As a result of they’re inbuilt pure CSS3, the preloaders are retina-ready by default.
- Every preloader features a GIF fallback for IE.
- Preload a whole net web page (see video above) with a lightbox-style fullscreen preloader.
- An API methodology that permits you to fade the preloader out and in (upon fadeout the keyframe animation is eliminated mechanically for optimum efficiency).
Light-weight and Straightforward to Use
The minified CSS is simply 3kb, and the minified JS solely 1kb.
Right here’s a pattern of the markup for the primary preloader:
<div class="cj-preloader cj-spin"> <span class="cj-outside" /><span class="cj-inside" /> </div>
– The primary two variations usually are not 100% clear. The third model of the preloader is.
– That is NOT a WordPress Plugin.
Extra information from CodingJack