Animate BG
For Stackoverflow
HTML
<div id="one">.</div>
<div id="two">.</div>
<div id="three">.</div>
CSS
*{
margin: 0px;
padding: 0px;
}
div{
height: 1000px;
}
#one{
background-color: red;
}
#two{
background-color: blue;
}
#three{
background-color: green;
}
JavaScript
$(document).ready(function(){
$(window).scroll(function(){
var scrolled = $(this).scrollTop();
console.log(scrolled);
if (scrolled >= 200) {
//$("#one").animate({"background-color":"white"},500);//doesn't work
$("#one").css({"background-color":"white"}); //works well
console.log(scrolled);
}
});
});