Scroll-triggered Color Transition Effect With jQuery

Scrolling Background Color is a really small jQuery plugin which makes use of jQuery color.js library to apply a smooth color transition effect to background when you scroll down the webpage.

How to use it:

1. Load the needed jQuery and jQuery color.js plugin in the html page.

<script src="jquery.min.js"></script>
<script src="jquery.color.min.js"></script>

2. Call the function to initialize the plugin with default options.

// for the entire page background
$(window).scrollingBackgroundColor(); 

// for the background of #element
$('#element').scrollingBackgroundColor(); 

3. Specify the start/end colors you want to transition between.

$("#element").scrollingBackgroundColor( {
  from: "#CCCCCC",
  to: "#FFFFFF", 
});

4. Set the target and watch elements.

$("#element").scrollingBackgroundColor( {
  target: 'body',
  watch : '#element'
});

---

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