Изменение высоты при остановке скролла

День добрый.

Научился отлавливать скролл блока и изменять css-свойства при начале скроллирования:

$('.work-page').scroll(function(e){
        if ($(this).scrollTop() > 50) {
            $("#top .top-menu ul").animate({
                "padding-top" : "20px"
            }, 300);
});

А вот теперь возник вопрос - как возвращать дефолтные значения?
Делаю для того, чтобы при начале пролистывания блока .work-page у меня header и footer уменьшались по высоте, раздвигая область экрана для просмотра .work-page (там список фотографий, и чем больше поле, тем лучше).
Задача: чтобы при остановке скроллинга header и footer также плавно возвращались к первоначальным своим значениям.

Заранее спасибо за помощь.