Как сделать такое меню в мобильнойверсии сайта?

Question

[Сергей Шурыгин]

Есть вопрос как сделано меню в мобильной версии сайта www.rmchampagnesalon.com ?, а именно:



Появляется оно при пролистывании с низу вверх.
Спасибо.

Answer 1

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

Это можно сделать примерно так: jsfiddle.net/IonDen/1orqh5tb

var $win = $(window),
    $menu = $('.menu'),
    oldY = 0,
    y = 0;

function scroll () {
    y = $win.scrollTop();
    
    if (y > oldY) {
        tglMenu(false);
    } else {
        tglMenu(true);
    }
    
    oldY = y;
}

function tglMenu (state) {
    $menu.toggleClass('active', state);            
}

$win.on('scroll', scroll);

<div class='test'></div>
<div class='menu'>Menu</div>

.test {
    width: 100px;
    height: 3000px;
}

.menu {
    position: fixed;
    bottom: 0; left: 0;
    width: 100%;
    height: 70px;
    background: #f00;
    display: none;
}
.menu.active {
    display: block;
}