Как сделать плавное возвращение меню?

Question

[oksana92]

Добрый день!
Как сделать плавное возвращение для меню?
т.е меню появилось плавно, а когда поднимаешься вверх первоначальное меню пропадает
Мой код - https://jsfiddle.net/y6jL8j6o/

Answer 1

[Денис Инешин]

Чуть по сложнее нужно: https://jsfiddle.net/IonDen/s33v2roh/

var show = false;
var $nav = $("nav");

function showFixed() {
    if (show) {
        return;
    }

    show = true;

    $nav.hide().addClass("nav-fixed").slideDown();
}

function hideFixed() {
    if (!show) {
        return;
    }

    show = false;

    $nav.slideUp(function() {
        $nav.removeClass("nav-fixed").slideDown();
    });
}

$(window).scroll(function() {
    var scroll = $(window).scrollTop();

    if (scroll >= 350) {
        showFixed();
    } else {
        hideFixed();
    }
});

Answer 2

[devstudent]

jQuery(function() {
    $(window).scroll(function() {
        var scroll = $(window).scrollTop();

        if (scroll >= 350) {
            $("nav").addClass("nav-fixed");
        } else {
            $("nav").removeClass("nav-fixed");
        }
    });
});

для плавности добавьте с стили классов свойство transition-duration

Comments

[oksana92]

А как в css сделать слайд эффект для данного кода?

[devstudent]

oksana92: задача не ясна