JQuery航路点函数在调整大小后未重置

我已经在StackOverflow上广泛查找了这个问题的答案，但找不到任何解决我问题的方法

基本上，我有一个在报头中触发的航路点函数。根据窗户的宽度，它应该以两种不同的方式开火。在宽度参数（一个小于750像素，另一个大于750像素）内加载脚本会导致预期的行为

但是，如果用户将屏幕的大小从800像素调整到400像素，则800像素的功能仍会运行。尽管函数已绑定到调整大小事件，但仍会出现这种情况

我有一种感觉，我需要刷新功能完全调整大小，但我不知道如何实现这一点

下面是我的代码。我尝试在同一个函数中运行mobileView和tabletView，但总是得到相同的结果

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();
        },
    });

var\u w=Math.max（$（窗口）.width（），$（窗口）.height（））；
var mobileView=（w=751）；
var header_cta=$（“.header_cta”）；
var midbar=$（“.midbar”）；
var header_container=$（“.header”）；
var top_间距=0；
var航路点_偏移=1；
//var scrollbar=（window.innerWidth-$（window.width（））；
var header_航路点_handler=新航路点（{
元素：document.getElementById（'header\u waypoint'），
处理程序：函数（方向）{
功能大\头\航路点（）{
如果（大视图）{
如果（方向==‘向下’）{
header_container.css（{'height'：midbar.outerHeight（）}）；
midbar.stop（）；
}
如果（方向==“向上”）{
header_container.css（{'height'：'auto'}）；
midbar.removeClass（“stick”）.css（“top”，midbar.outerHeight（）+航路点_偏移量）.animate（{“top”：“}）；
}
}
}
功能移动\头\航路点（）{
如果（mobileView）{
如果（方向==‘向下’）{
$（'div.header\u hamburger\u menu'）.addClass（'stick'）；
header_container.css（{'height'：header_cta.outerHeight（）}）；
header_cta.stop（）.addClass（“stick”）.css（“top”，-header_cta.outerHeight（））.animate（{“top”：top_space}）；
}
如果（方向==“向上”）{
$（'div.header\u hamburger\u menu'）。removeClass（'stick'）；
header_container.css（{'height'：'auto'}）；
header_cta.removeClass（“stick”）.css（“顶部”，header_cta.outerHeight（）+航路点_偏移量）。动画（{“顶部”：“}）；
}
}
}
$（窗口）。调整大小（函数（）{
大_头_航路点（）；
移动_头_航路点（）；
}).resize（）；
},
});

在这里参加聚会很晚，但我最近在水平滚动站点上实现Waypoints 4.0.0（无框架）时遇到了类似的问题

对于记录，文档说明在调整窗口大小时调用刷新：

调整窗口大小时自动执行，因此仅当在调整大小之外发生布局更改时，才需要手动调用该窗口

无论出于何种原因，这似乎没有像预期的那样发生，因此我利用一个旧的去抖动函数（John Hann-）结合

Waypoint.refreshAll（）

去盎司功能：

// debouncing function from 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');

使用航路点调用解Bounce：

// Refresh Waypoints after browser resize:
$(window).smartresize(function(){
    Waypoint.refreshAll();
});

在这里参加聚会很晚，但我最近在水平滚动站点上实现Waypoints 4.0.0（无框架）时遇到了类似的问题

对于记录，文档说明在调整窗口大小时调用刷新：

调整窗口大小时自动执行，因此仅当在调整大小之外发生布局更改时，才需要手动调用该窗口

无论出于何种原因，这似乎没有像预期的那样发生，因此我利用一个旧的去抖动函数（John Hann-）结合
Waypoint.refreshAll（）

去盎司功能：

// debouncing function from 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');

使用航路点调用解Bounce：

// Refresh Waypoints after browser resize:
$(window).smartresize(function(){
    Waypoint.refreshAll();
});

您是否尝试过
Waypoint.refreshAll（）已尝试但没有任何运气。已将其与resize事件一起放置，并且也放置在函数中。然而，我有一种感觉，我一直在错误地使用它。我记得有一个粘性标题类似的问题。我最终切换到了，因为它会自动响应。无需刷新您是否尝试过
Waypoint.refreshAll（）已尝试但没有任何运气。已将其与resize事件一起放置，并且也放置在函数中。然而，我有一种感觉，我一直在错误地使用它。我记得有一个粘性标题类似的问题。我最终切换到了，因为它会自动响应。不需要刷新