jQuery Plugin To Dynamically Change Background Colors - bgcFade

bgcFade is a plugin for jQuery and jQuery UI to fade in/out the background color of your page based on CSS styles.

Basic Usage:

1. Load the jQuery javascript library and jQuery UI in the page.

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/jquery-ui.min.js"></script>

2. Load the jQuery bacfade Plugin in the page, after jQuery library.

<script type="text/javascript" src="bgcfade.js"></script>

3. Define the background colors you want to change in the CSS.

<style>
.fadeblue {
background: #2D34C4;
}
.fadered {
background: #C42D2D;
}
.fadegreen {
background: #50B733;
}
.fadeyellow {
background: #C4C42D;
}
.fadecyan {
background: #2DC4C4;
}
</style>

4. By default the plugin will change the background color of your body element (the whole page). You can customize the plugin in the in the backfade.js.

maxcolors = 4,
fadespeed = 6000,
element = $("body"); 

---

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