如何在windows width上禁用此jquery功能<；500px

我已经为我的徽标使用了添加和删除类功能

我想在windows宽度<500px时禁用该功能

这是我使用的脚本

$(document).on('scroll', function () {
    if ($(this).scrollTop() > 50) {
        $('header').addClass('sticky');
        $('#logo').addClass('none');
        $('#logo-black').removeClass('none');
    } else {
        $('header').removeClass('sticky');
                $('#logo').removeClass('none');
        $('#logo-black').addClass('none');
    }
});

---

只需检查处理程序内的窗口宽度

$(document).on('scroll', function () {
   if($(window).width() >= 500){
     if ($(this).scrollTop() > 50) {
        $('header').addClass('sticky');
        $('#logo').addClass('none');
        $('#logo-black').removeClass('none');
     } else {
        $('header').removeClass('sticky');
        $('#logo').removeClass('none');
        $('#logo-black').addClass('none');
    }
  }
});

---

使用

window.innerWidth

计算窗口的宽度，不包括工具栏和滚动条

$(document).on('scroll', function () {

    if (window.innerWidth < 500) return; // Use this

    if ($(this).scrollTop() > 50) {
        $('header').addClass('sticky');
        $('#logo').addClass('none');
        $('#logo-black').removeClass('none');
    } else {
        $('header').removeClass('sticky');
                $('#logo').removeClass('none');
        $('#logo-black').addClass('none');
    }
});

$（文档）.on（'scroll'，函数（）{
如果（window.innerWidth<500）返回；//使用此
如果（$（this）.scrollTop（）>50）{
$（'header'）.addClass（'sticky'）；
$（'#logo'）.addClass（'none'）；
$（“#徽标黑色”）.removeClass（'none'）；
}否则{
$（'header'）.removeClass（'sticky'）；
$（“#logo”）.removeClass（'none'）；
$（“#黑色徽标”）.addClass（'none'）；
}
});

您可以设置一个条件

if($(window).width() > 500 ) {
    $(document).on('scroll', function () {
       if ($(this).scrollTop() > 50) {
           $('header').addClass('sticky');
           $('#logo').addClass('none');
           $('#logo-black').removeClass('none');
       } else {
           $('header').removeClass('sticky');
           $('#logo').removeClass('none');
           $('#logo-black').addClass('none');
        }
    });
}

---

在css中这是可能的，为什么要使用Javascript。我假设您正在寻找固定标题。我们只能通过使用媒体查询在css中处理这个问题。看看这个

.header{
位置：固定；
左：0；
右：0；
高度：50px；
背景：红色；
}
身体{
高度：1000px；
宽度：100%；
保证金：0
}
@仅介质屏幕和（最大宽度：500px）{
.标题{
位置：相对位置；
}
}

粘头

窗口。innerWidth

不排除垂直滚动条（如果存在），但

document.documentElement.clientWidth

排除垂直滚动条。