Прокрутка фона после прокрутки меню

Вопрос касается именно IOS (Safari), на Android все хорошо. Сайт

Разрешение 1199 и меньше. Появляется меню - Выбрать город и категорию. При клике на него открывается боковое меню и после его прокрутки до самого конца, начинает прокручиваться сам фон сайта. Если прокрутить в обратную сторону, то ситуация повторяется, - как только доходим до верха меню, дальше начинает прокручиваться фон под меню.

Меню выглядит так:

<div class="navigation_city">
    <nav id="navigation_new">
        <ul>
            <div id="close_select_city"><img src="images/close_big_x.png" alt="Закрыть"></div>
            <li><a href="#">Минск</a><span class="quantity_gold2">250</span></li>
            <li><a href="#">Брест</a><span class="quantity_gold2">25</span></li>
            <li><a href="#">Гродно</a><span class="quantity_gold2">15</span></li>
            <li><a href="#">Могилев</a><span class="quantity_gold2">29</span></li>
            <li><a href="#">Гомель</a><span class="quantity_gold2">45</span></li>
            <li><a href="#">Витебск</a><span class="quantity_gold2">85</span></li>      
        </ul>
    </nav>

Это то что делается с ним в JS:

var icon = document.getElementById("select_city_new"),
active = false,
body = document.body,
nav = document.getElementById("navigation_new"),
navCity = document.getElementsByClassName("navigation_city")[0],
close_select_city = document.querySelector("#close_select_city>img"),
area = document.getElementById("area");
icon.addEventListener("click",activeMenu);
function activeMenu(){
        close_select_city.onclick = function(){
        document.body.style.overflow = 'scroll';    
        nav.style.left = "100%";  
        nav.style.height = "0";
        navCity.style.height = "auto";
        button.disabled = false;
        nav.style.overflow = "hidden";
        active = false;
    }
    if(active){
        nav.style.left = "100%";
        nav.style.height = "0";
        nav.style.overflow = "hidden";
        navCity.style.height = "0";
        button.disabled = false;
        document.body.style.overflow = 'auto';
        active = false;
    }else{
        nav.style.left = "0";
        nav.style.height = "100%";
        button.disabled = true;
        nav.style.overflow = "scroll";
        navCity.style.height = "auto";
        document.body.style.overflow = 'hidden';
        active = true;
    }
}

navCity.style.height = "0";
navCat.style.height = "0";

Можно ли как-то избавиться от этой непонятной прокрутки фона, после того как само меню просто про крутится до конца?