<div class="nav">
Change color on scroll
</div>
body {
height:2000px;
background-color: #808080;
}
.nav {
width: 100%;
height: 40px;
position: fixed;
background-color: green;
border: 1px solid #000;
}
$(document).ready(function(){
$(document).scroll(function() {
var alpha = Math.min(0.5 + 0.4 * $(this).scrollTop() / 210, 0.9);
if(alpha != 0.5) {
$(".nav").css('background-color', 'transparent');
} else {
$(".nav").css('background-color', 'green');
}
//var channel = Math.round(alpha * 255);
console.log(alpha);
//$(".nav").css('background-color', 'transparent');
});
});