Changing var within function (jQuery question)

Hello :slight_smile:

Unfortunately, I'm unable to figure this out by myself at this moment.

Backstory (not too important):
I have a variable that needs to be set when the user scrolls, clicks or does anything outside of the header.
That variable determines what scroll position the screen is on.

This variable has to be set because silly iOS thinks that the viewport is awesome and must be viewed as a whole.
So this viewport (html AND body) need not only their overflow removed, but also must have a fixed height (100%) and 0 padding, margin or border.

Anyway, enough CSS and HTML talk.

What the question is: How do I update a var inside a function when the user does something (click, touch, scroll, move) within this function?

The variable I want to update: "currentPos".
This is what I currently have and currentPos is set when the document is ready, unfortunately it isn't updated on touch, click, scroll or move.

//* Remove scroll on body if mobile menu is open
function rems() {
     var headerNav = $('.header-nav');
     var currentPos = $(window).scrollTop();

//doesn't work as expected
     $('body').on('touchstart click touchmove scroll', function(e) {
          if (!headerNav.is(e.target) && headerNav.has(e.target).length === 0) {
               var currentPos = $(window).scrollTop();
          }
     });

// works perfectly
     headerNav.on('touchstart click', (function() {
          if ($('#nav-tab-guide, #nav-tab-info, #nav-tab-support, #nav-tab-user').is(':checked')) {
               $('html').addClass('mobile-menu-open');
          } else if ($('#nav-tab-logo').is(':checked')) {
               $('html').removeClass('mobile-menu-open').delay(10);
               $(window).scrollTop(currentPos).delay(50);
          }
     }));
}
$(document).ready(function() { rems();});

P.S. I notice that the textarea within this site doesn't comply to my indents (tabs) so I used spaces in pairs of 5.