Parallax for the header

gistfile1.js

var hero = document.getElementById("header"),
    heroHeight = $(hero).outerHeight();
    
function updateScroll() {
    scrollAmount = $(window).scrollTop();
    if (scrollAmount <= heroHeight) {
        hero.style['-webkit-transform'] = 'translate3d(0, ' + (scrollAmount / 2) + 'px, 0)';
    } else if (scrollAmount <= heroHeight) {
        $(self).css('top', (scrollAmount / 2) + 'px');
    }
}

window.onscroll = function () {
    updateScroll();
}