Как решить две проблемы: (1) прокрутка фона Popup и (2) выползание сайта за экран?

.scroll-hidden {
    overflow: hidden;
}

$("body").addClass("scroll-hidden"); // Добавление класса
$("body").removeClass("scroll-hidden"); // Удаление класса
$("body").toggleClass("scroll-hidden"); // Удаление либо добавление класса в зависимости от его наличия

//Функция отображения PopUp
    function PopUpShow(){
        $("#popup1").show();
    }
    //Функция скрытия PopUp
    function PopUpHide(){
        $("#popup1").hide();
    }

//Функция отображения PopUp
    function PopUpShow(){
        $("#popup1").show();
        $("body").addClass("scroll-hidden");
    }

//Функция скрытия PopUp
    function PopUpHide(){
        $("#popup1").hide();
        $("body").removeClass("scroll-hidden");
    }

<!-- НИЖЕ СКРЫТИЕ ПОПАПА КЛИКОМ ПО НЕАКТИВНОЙ=ФОНОВОЙ ОБЛАСТИ -->
  <script>
    $(document).mouseup(function (e) {
            var container = $("#popup1");
            if (container.has(e.target).length === 0){
                container.hide();
                $("body").removeClass("scroll-hidden"); 
            }
    });
  </script>

.scroll-hidden {
    position: fixed;
    width: 100%;
    height: 100%;
    overflow: hidden;
}