Question

I want to gradually cycle through different background colors for a fixed div as you scroll down the page. I think I can do this using jQuery waypoints, but need a hand starting this as I have no idea where to start.

Website I’m working on is here: http://www.samskirrowdesign.com I want to change the color of the 3px high fixed div at the top of the page.

Answer 1

Based on your scroll top position you can have a gradient change like

   $(window).scroll(function () { 
    $('#test').css('background-color','#BC46'+($(this).scrollTop()/10))
    });

Look at this fiddle

JSFIDDLE