I would try something like:

I am using some code to disable scrolling and also retain the scrollbar when the fullscreen menu is active, but when the menu is opened by clicking the hamburger icon, the page jumps to the top. Any idea how to stop this happening?

.noscroll {
  position: fixed;
  overflow-y:scroll;
}
jQuery(document).ready(function($){
    $('.btn-open-menu').click(function () {
      let scrollPosition = $(document).scrollTop();
      $('html, body').addClass('noscroll');
      $('html, body').css('top', '-'+scrollPosition+'px');
      $('html, body').attr('data-scroll', scrollPosition);
    })
    
    $(document).on('click','.btn-close-menu', function(event){
        $('html, body').removeClass('noscroll');( {}, event);
        $(document).scrollTop( $('html, body').attr('data-scroll') )
    })
       
});

This will make the body fixed, but it will set its position to the current scroll position instead of the top of the page.

EDIT: Try saving the scrollposition to element attribute so you can access it while closing the menu and set the document scroll position accordingly

I think the issue is your css, I use a similar system on some of my sites and the css I use is just:

.noscroll {
  overflow: hidden;
}