evorios

Я предполагаю, что section – это как раз "другой слайд":

$('#main').click(function() {
    $('section').addClass('animated flipInY');
    $('#main').hide();
});

PS. вопрос не вполне понятен...

Для себя я решил эту проблему таким образом:

body {
  margin: 0;
  overflow: hidden;
}

body > .scroll-box {
    position: relative;
    left: 0;
    right: 0;
    height: 100%;
    max-height: 100vh;
    overflow-y: auto;
}

Таким образом блокируется прокрутка страницы, следовательно навигационная панель будет видна всегда. А также 1vh будет постоянным. Прокрутка же появляется, если внутри контейнера .scroll-box содержимое не помещается по вертикали. Прокрутка контейнера никак не повлияет на размеры body. Все лайтбоксы, модальные окна и выдвигающиеся меню помещаются в body для того, чтобы появление прокрутки никак не влияло на верстку этих окон.
PS. Для блокировки паразитной прокрутки основного контейнера во время прокрутки модального окна я добавил в JS:

$modal.on('show', () => $scrollBox.css({ 'pointer-events': 'none' }));
$modal.on('hide', () => $scrollBox.css({ 'pointer-events': 'auto' }));