Stylish Page Preloader with jQuery and CSS3 - Moomba Preloader

Moomba Preloader is a tiny jQuery plugin which allows you to hide content with a stylish preloader until the webpage has loaded. Animated with CSS3 transitions and transforms and no any images required.

How to use it:

1. Load the jQuery library and the jQuery Moomba Preloader's CSS and Javascript in the web page.

<script src="//code.jquery.com/jquery-2.1.1.min.js"></script> 

<link rel="stylesheet" href="jquery.preloader-1.2.css">
<script src="jquery.preloader-1.2.js"></script>  

2. Call the plugin on the body tag and we're done.

$(function() {
  $('body').moombaPreloader(OPTIONS);
});

3. Customize the page preloader via JavaScript options object.

'type': 1,  // Rectangle(1), Square(2)
'bg_color'    : 'rgb(225,225,225)', // Background Color

// Rectangle(1) 
'r_box_color' : 'rgb(254,254,254)', // Outer shell
'r_bar_color' : 'rgb(204,102,51)' , // Inner Bar

// Square(2)
's_box_color' : 'rgb(254,254,254)', // Outer shell
's_square_1'  : 'rgb(40,55,64)',    // Top Left
's_square_2'  : 'rgb(138,178,159)', // Top Right
's_square_3'  : 'rgb(191,168,118)', // Bottom Left
's_square_4'  : 'rgb(89,51,37)',    // Bottom Right  

---

This awesome jQuery plugin is developed by simoncorry. For more Advanced Usages, please check the demo page or visit the official website.