JQuery Waypoint function not reseting after resize -

i've looked around extensively on stackoverflow answer , can't find fixes issue.

basically, i've got waypoint function fires in header. it's supposed fire in 2 different manners, depending on window width. loading script within width parameters (one less 750 pixels, other greater 750 pixels) results in expected behaviour.

if user resizes screen, however, going 800 pixels 400 pixels, function 800 pixels still runs. despite function being bound resize event.

i have feeling need refresh function entirely on resize, unsure how achieve this.

below code. i've tried running mobileview , tabletview in same function, same result.

var _w = math.max( $(window).width(), $(window).height() );     var mobileview = (_w <= 750);     var largeview = (_w >= 751);          var header_cta = $(".header_cta");     var midbar = $(".midbar");     var header_container = $(".header");      var top_spacing = 0;     var waypoint_offset = 1;      //var scrollbar = (window.innerwidth-$(window).width());      var header_waypoint_handler = new waypoint({                      element: document.getelementbyid('header_waypoint'),         handler: function(direction) {                                                function large_header_waypoint() {                 if (largeview) {                     if (direction === 'down') {                         header_container.css({ 'height':midbar.outerheight() });                                 midbar.stop().addclass("stick").css("top",-midbar.outerheight()).animate({"top":top_spacing});                     }                     if (direction === 'up') {                         header_container.css({ 'height':'auto' });                         midbar.removeclass("stick").css("top",midbar.outerheight()+waypoint_offset).animate({"top":""});                      }                  }             }              function mobile_header_waypoint() {                 if (mobileview) {                      if (direction === 'down') {                       $('div.header_hamburger_menu').addclass('stick');                       header_container.css({ 'height':header_cta.outerheight() });                             header_cta.stop().addclass("stick").css("top",-header_cta.outerheight()).animate({"top":top_spacing});                     }                     if (direction === 'up') {                       $('div.header_hamburger_menu').removeclass('stick');                       header_container.css({ 'height':'auto' });                       header_cta.removeclass("stick").css("top",header_cta.outerheight()+waypoint_offset).animate({"top":""});                     }                 }             }              $(window).resize(function() {                 large_header_waypoint();                 mobile_header_waypoint();             }).resize();         },     }); 

late party here ran similar problem implementing waypoints 4.0.0 (no-framework) on horizontally scrolling site.

for record documentation states refresh called on window resize:

automatically when window resized, needs called manually when layout changes happen outside of resize.

for whatever reason doesn't appear happening expected worked around leveraging old debouncing function (john hann - http://unscriptable.com/2009/03/20/debouncing-javascript-methods/) in combination waypoint.refreshall();.

debounce function:

// debouncing function john hann (function($,sr){     var debounce = function (func, threshold, execasap) {         var timeout;         return function debounced () {             var obj = this, args = arguments;             function delayed () {                 if (!execasap)                     func.apply(obj, args);                 timeout = null;             };             if (timeout)                 cleartimeout(timeout);             else if (execasap)                 func.apply(obj, args);             timeout = settimeout(delayed, threshold || 100);         };     }     // smartresize      jquery.fn[sr] = function(fn){         return fn ? this.bind('resize', debounce(fn)) : this.trigger(sr);     }; })(jquery,'smartresize'); 

call debounce waypoints:

// refresh waypoints after browser resize: $(window).smartresize(function(){     waypoint.refreshall(); });