Плавное скрытие блока при прокрутке?

Question

[lilzen]

Приветствую знатоки всего и вся. Столкнулся с такой проблемой есть меню состоящее из двух блоков.. Логотип и кнопки меню. Так вот задача в том что блок меню фиксирован и нужно что бы при начале прокрутки плавно скрывался блок с логотипом и оставались кнопки меню которые должны соответственно подтянуться к верху страницы. и при возврате обратно все возвращалось на свои места. Подскажите как это можно реализовать?!
я Пытался это реализовать это так

$(document).ready(function(){   
    $(window).scroll(function () {
        if ($(this).scrollTop() > 0) {
            $('#label').fadeIn();
        } else {
            $('#label').fadeOut();
        }
    });
});
но так как блок фиксирован он не прокручивается и ни чего не происходит

Answer 1

[dmitry87]

так https://jsfiddle.net/r0qf51tL/ ?

Answer 2

[lilzen]

Да это оно спасибо только почему то transition не отрабатывает код просто сворачивает блок резко

.menu-box{
	position: fixed;
	z-index: 99;
}
#label_none{
	min-height: 100px;
    overflow: hidden;
    transition: height 1s ease;
    height: 0;
}
.hidden {
    min-height: 0;
}

Comments

[dmitry87]

поставь transition all или min-height

[lilzen]

пробовал не заработало...