I'm working on a small portfolio website and at the moment I'm at the stage of sorting the breaking points/media queries. Very quickly I realized the in order to achieve that, I need to stop some JS functions from keep happening at a certain screen width.

I basically designed the website so each section will take the full height of the window and the side bar takes 2x the height. I want the side bar to stop that function and change other function like slide and pin at 1240px width.

https://github.com/Mooli88/portfolio The full code can be found under /components/script

Code:
function fullheight(selector, tims) {
    var winheight = $(window).height();

    var sidenavLimit = winwidth < 1240;

    $(selector).css('height', winheight * tims);
    $(window).resize(function() {
        var winheight = $(window).height();
        $(selector).css('height', winheight * tims);
      }) //resize
  } //fullheight

fullheight('.fullheight', 1);
fullheight('.fullheightMid', 1.3);
fullheight('.side_nav', 2);
I've tried numerous solutions that I found here and on google but always got stuck with something else (i.e the function stops but is not coming back when needed).