Estou construindo uma página emfullpage.js. No primeiro slide, há uma imagem que consome 90% da altura da janela de exibição. Os outros 10% são uma barra de navegação abaixo da imagem. A imagem abaixo demonstra isso.

Ao rolar para o próximo slide, quero que a barra de navegação se torne um cabeçalho fixo para o restante dos slides.

Eu tentei fazer o elemento consertar uma vez que éoffset().top o valor é 0 contra$(window).top() usando jQuery. Isto não funcionou para mim.

$(window).scroll(function () {
    var nav = $('#nav');

    var eTop = nav.offset().top;
    if ((eTop - $(window).scrollTop()) == 0) {
        nav.addClass('fixed');
    }
    else {
        nav.removeClass('fixed');
    }
});

Isso é possível e como faço para alcançá-lo?