Tentando adicionar efeito de transição deslizante ao adicionar e remover classe.Tentei este nav js pegajoso abaixo:

lastScroll = 0;
$(window).on('scroll',function() {    
    var scroll = $(window).scrollTop();
    if(scroll === 0){
        $(".nav").removeClass("darkHeader");
    } else if(lastScroll - scroll > 0) {
        $(".nav").addClass("darkHeader");
    } else {
        $(".nav").removeClass("darkHeader");
    }
    lastScroll = scroll;
});

Minha tentativa:

lastScroll = 0;
$(window).on('scroll',function() {    
    var scroll = $(window).scrollTop();
    if(scroll === 0){
        $(".nav").removeClass("darkHeader", 1000, "easeInOutQuad");
    } else if(lastScroll - scroll > 0) {
        $(".nav").addClass("darkHeader", 1000, "easeInOutQuad");
    } else {
        $(".nav").removeClass("darkHeader", 1000, "easeInOutQuad");
    }
    lastScroll = scroll;
});

Estou tentando isso adicionando1000, "easeInOutQuad" , tentando fazer isso por jquerysem CSS3 (sem CSS, por favor).
ProblemaViolino >>

Estou tentando implementar o efeito slide comoesta >>