Прокрутка div без использования переполнения

Question

У меня есть боковая панель, которую нужно прокрутить, если высота области просмотра меньше, чем боковая панель. Я сделал решение, которое будет работать в данный момент, но оно будет работать на каком-то экране или если пользователь, возможно, не развернул свой экран. Я не могу использовать прокрутку переполнения, поскольку на боковой панели есть выпадающие меню, которые переполняются с боковой панели. Они абсолютно позиционированы. Если применить прокрутку переполнения-y, то он будет скрывать выпадающие списки. Поэтому я использовал относительное положение и изменил положение элементов меню боковой панели для переключения вверх и вниз с помощью событий прокрутки. Я прилагаю свой код ниже. Все, что мне нужно, это установить максимальное значение на css и прокрутить шаг за шагом, а не идти вверх или вниз по каждому событию. Я надеюсь, что передал свое сообщение, чтобы вы, ребята, могли помочь.

$(window).scroll(function(){
    var menCont = $("#menu-content")
    var compHeight = window.innerHeight - $(".brand").height()
    var amountScroll = compHeight - menCont.height() -28

    if(menCont.height() >= compHeight) {
        $(menCont).on('mousewheel', function(e){
            // scroll up
            if (e.originalEvent.wheelDelta >= 1) {
                menCont.css('top', '')
            }
            // scroll down
            if ((e.originalEvent.wheelDelta <= 1)) {
                menCont.css('top', amountScroll)
            }
            // to prevent scrolling on the main content area
            e.preventDefault();
        })
    }
})