jquery - スクロール中に背景色を変更する

Question

ヘッダーの背景色を、スクロールする div の背景色に変更したいと思います。したがって、div #about (緑) までスクロールすると、ヘッダーの背景色も緑に変わります。これまでのところこれがありますが、機能していません。どんな助けでも大歓迎です。

var t = $('#about').offset().top - 100;

$(document).scroll(function(){
    if($(this).scrollTop() > t)
    {   
        $('header').css({"background-color":"green"});
    } 
});

私のフィドルをチェックしてください。