Offsetting scrollTop

Question

I have the following snippet

$('html,body').animate({scrollTop: $('#menu').offset().top}, 'slow');

On click of a link I would like the browser to display from near the top of the #menu div. I would like it display just few pixels lines before the menu.

How can I achieve this?

I have added paddingTop:5 to offset() but this is not the desired result.

Solution

Just subtract whatever amount you want from $('#menu').offset().top:

$('html,body').animate({
    scrollTop: $('#menu').offset().top - 5 // or 10
}, 'slow');

Here's the fiddle: http://jsfiddle.net/qVWuv/