jquery - 我有一个函数在调用媒体查询时仍在影响 div 的位置，我想停止它

Question

我正在使用一个使元素固定在滚动条上的函数，我不希望这个函数在我触发媒体查询时仍然有效。

function scroll_fixbar() {
    var topBar = $("#latestWrapper");
    if ($(this).scrollTop() > 145) {
        if (topBar.css('position') !== 'fixed') {
            topBar.css("position", "fixed");
            topBar.css("top", "0px");
        }
    } else {
        if ($("#AddFixedLatest").css('position') !== 'static') {
            topBar.css("position", "absolute");
            topBar.css("top", "145px");
        }
    }
}

function media_query(obj) {
    size = obj();
    var pathname = window.location.href;
    if (size != currentSize) {
        var sideBar = $('#sidebarWrapper');
        var wrapper = $('#wrapper');
        var menuBtn = $('.menuButton', '#menuOption');
        if (size == 'mobile') {
            currentSize = 'mobile';
        }
        if (size == 'tablet') {
            currentSize = 'tablet';
        }
        if (size == 'laptop') {
            $(window).scroll(function () {
                scroll_fixbar();
            });
            currentSize = 'laptop';
        }
    }

};

$(window).resize(_.debounce(function () {
    media_query(mqCSS);
}, 10));


$(window).load(function () {
    media_query(mqCSS);
});

当调整浏览器大小时，scroll_fixbar(); 当我触发“平板电脑”媒体查询时，css 属性仍然影响我的 div。

我能做些什么来阻止这种情况的发生，他们是一种“刷新”div 的方法，或者在 (size == 'tablet') 时关闭该功能

感谢帮助。

Answer 1

试试这个:

    if (size == 'mobile') {
        currentSize = 'mobile';
        $(window).off('scroll', scroll_fixbar);
    } else if (size == 'tablet') {
        currentSize = 'tablet';
        $(window).off('scroll', scroll_fixbar);
    } else if (size == 'laptop') {
        $(window).on('scroll', scroll_fixbar);
        currentSize = 'laptop';
    }