Thanks to CBroe for his hint! This is a working solution:
$(function () {
var stickyHeaderTop = $('#outer-header').offset().top;
$(window).scroll(function () {
if ($(window).scrollTop() >= stickyHeaderTop) {
$('#outer-header').css({
position: 'fixed',
top: '-300px'
});
$('#main').css({
position: 'relative',
top: '332px'
});
} else {
$('#outer-header').css({
position: 'absolute',
top: '0px'
});
$('#main').css({
position: 'relative',
top: '332px'
});
}
});
});