Hide or fade div on scroll down

http://thelittletechie.blogspot.com/2014/08/how-to-hidefade-div-on-scroll-down.html

HTML

<div>
    <div class="fade">
        Scroll down i will become invisible
    </div>
</div>

CSS

body {
    height: 2000px;    
}
.fade {
    height: 300px;
    width: 300px;
    background-color: #d15757;
    color: #fff;
    padding: 10px;
}

JavaScript

$(window).scroll(function() {

    if ($(this).scrollTop()>0)
     {
        $('.fade').fadeOut();
     }
    else
     {
      $('.fade').fadeIn();
     }
 });