Hide content on scroll

A nice way to hide conten when you scroll down the page.

by Martin Emanuelsson

HTML

<div class="content">Test</div>

CSS

body {height:2000px;}
.content {margin:0 auto; display:block; width:50%; height:400px; background-color:#000;}

JavaScript

$(window).scroll(function() {
    $(".content").css({
    'opacity' : 1-(($(this).scrollTop())/400)
    });          
});