Delivering the best Add-Ons in more than 37 languages.

中文(简体), English, हिन्दी/हिंदी, Español/Castellano, العربية, Русский язык, Français, 中文 (台灣), বাংলা, Bahasa Indonesia, اردو, Português, Deutsch, Bahasa Melayu (بهاس ملايو‎), 日本語 (にほんご), فارسی, Italiano, తెలుగు, Türkçe, ગુજરાતી, Język polski/polszczyzna, Tiếng Việt, ಕನ್ನಡ, Українська мова, ไทย
CSS / Animations and Effects

Smooth CSS3 Preloaders

— Add-On to

Subscribe to our feed to stay up to date!

New! Follow us as you want it!

Smooth CSS3 Preloaders - CodeCanyon Item for Sale


Ad: Bluehost hosting

Pure CSS3 Preloaders for Smoother Animation

Why Use a CSS3 Preloader?

Because GIF preloaders are often choppy during heavy lifting.
And because CSS3 looks and works fantastic on iOS!

What’s Included

  • The download source includes 3 custom-built pure CSS3 preloaders.
  • Minimal markup and easy implementation make these preloaders useful for just about any project.
  • Colors and size are easy to change.
  • Because they’re built in pure CSS3, the preloaders are retina-ready by default.
  • Each preloader includes a GIF fallback for IE.

JavaScript Options

The preloaders come with a few pure JavaScript options (no jQuery needed).

  • Preload an entire web page (see video above) with a lightbox-style fullscreen preloader.
  • An API method that allows you to fade the preloader in and out (upon fadeout the keyframe animation is removed automatically for optimal performance).

Lightweight and Easy to Use

The minified CSS is only 3kb, and the minified JS only 1kb.
Here’s a sample of the markup for the first preloader:

 <div class="cj-preloader cj-spin"> <span class="cj-outside" /><span class="cj-inside" /> </div> 

Special Notes

- The first two versions are not 100% transparent. The third version of the preloader is.

- This is NOT a WordPress Plugin.

More files from CodingJack

jQuery Lightbox

HTML5 Video Player

Fullscreen Gallery

Other components in this categoryAll components of this author
CommentsFrequently asked questions and answers


3 October 12

Last Update:
19 June 13

High Resolution:

Compatible Browsers:
IE7, IE8, IE9, IE10, IE11, Firefox, Safari, Opera, Chrome, Edge

Files Included:
JavaScript JS, CSS

Software Version:


eCommerce, eCommerce, All Items, ajax loader, ajax preloader, ajax preloaders, css preloader, css3 preloader, loader, page preloader, preloader, preloaders, pure css preloader, site preloader, spinning preloader, website preloader