Google Like jQuery Slim Progress Bar Plugin - NProgress

Google Like jQuery Slim Progress Bar Plugin - NProgress
File Size: 222 KB
Views Total:
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
   

NProgress is a tiny jQuery plugin for creating a slim and nanoscopic progress bar which features realistic trickle animations to convince your users that something is happening. Perfect for Turbolinks, Pjax, and other Ajax-heavy apps. Inspired by Google, YouTube, and Medium.

How to use it:

1. Include jQuery javascript library and jQuery NProgress plugin on the web page

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script src='nprogress.js'></script>

2. Include required jQuery NProgress stylesheet to style the progress bar

<link href='nprogress.css' rel='stylesheet' />

3. The javascript

<script>
$('body').show();
NProgress.start();
setTimeout(function() { NProgress.done(); $('.fade').removeClass('out'); }, 1000);
</script> 

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