Position fixed when scrolled passed certain amount of pixels

Question

I\'m looking for a way to position the #header element of my page as \"Fixed\" only after having scrolled downward for about 170 pixels.

Above the header is a banner, so

Answer 1

Here's a slightly more concise version:

var header = $('#header'),
    bannerHeight = $('#banner').height(),
    win = $(window);

win.scroll(function() {
    header.css({ top: Math.max(Number(win.scrollTop() - bannerHeight), 0) });
});