HTML5 UP! - Arcana sticky navigation

//Sticky menu
$( window ).load(function() {

    // grab the initial top offset of the navigation
    var topElement = $('#header h1');
    var el = $('#nav');
    var sticky_navigation_offset_top = 164; //default for 1080p screens

    // our function that decides weather the navigation bar should have "fixed" css position or not.
    var sticky_navigation = function(){
        var scroll_top = $(window).scrollTop(); // our current vertical position from the top

        // if we've scrolled more than the navigation, change its position to fixed to stick to top,
        // otherwise change it back to relative
        if (scroll_top > sticky_navigation_offset_top) {
            el.css({ 'position': 'fixed', 'top':0, 'left':0, 'zIndex':1000 });
        } else {
            el.css({ 'position': 'relative' });
        }
    };

    //Set top offset for navbar
    var setTopOffset = function(){
        //our offset is the bottom of the top element.
        sticky_navigation_offset_top = topElement.offset().top + topElement.outerHeight();
    };

    // run our function on load
    sticky_navigation();
    setTopOffset();

    // and run it again every time you scroll
    $(window).scroll(function() {
         sticky_navigation();
    });

    //On resize the css might have changed the navigation panel so a new offset should be calculated
    $( window ).resize(function() {
        setTopOffset();
    });

});