Skugga på fixed header och footer enbart vid scroll

Jag försöker åstadkomma skuggeffekt på enposition:fixed; header och footer med transition med css och jQuery med .scroll och .removeClass, detta ska ske enbart vid scroll och försvinna både vid toppen av dokumentet eller nånstans mitt i om man slutar scrolla.
Hittade en exempel på http://jsfiddle.net/Gz4R9/ som tar mig delvis dit jag önskar, men inte fullt ut.
Här är själva scriptet.

$(function(){
   
    $(window).on('scroll', function(){
        // At top of page.
        if ( ! $(document).scrollTop())
        {
            $('#fixedtop').removeClass('shadow');
        }
        // Not at top of page.
        else
        {
            $('#fixedtop').addClass('shadow');
        }
    });

});

Har någon nån tips i hur man skulle kunna ändra den kodden så att både header och footer visar skugga vid scroll och försvinner när man inte scrollar eller vid dokumentets topp?

tack

Tack Tobias,
Exakt det jag sökte, är fortfarande ny på jQuery Men ska gå genom scriptet. När man läser ditt script så förstår man ju en hel del direkt.
$('.header').addClass('shadow');
$('.footer').addClass('shadow');
adderar classen för skuggan men om 250 ms har gått på timeout, om det inte händer nåt scroll event så är det
$('.header').removeClass('shadow');
$('.footer').removeClass('shadow');
så tas skuggan bort.
Klart som korvspad när du skriver det

-tack

Tack.. har fått blodad tand på jQuery. Måste nu lära mig att dölja och visa formulärer i en div tag med fluidgrid, typ som eons hemsida när det körs i en mobil