根据窗口内部宽度执行函数

Question

当窗口宽度等于或小于约 500px 时，我需要启动一个函数 (scrollTop(，然后在 if 语句下执行函数 scrollTop 以在标签标签上添加一个类，但这样没有任何工作:(

这里的代码：

function screenClass() {
if($(window).innerWidth() < 484) {
//alert("500");
function AddClass() {
if ($(window).scrollTop() > 100) {
$(".show-menu").addClass("sticky");
} else {
$(".show-menu").removeClass("sticky");
}
}
}
}
$(window).bind("resize",function(){
screenClass();
});
<label id="navbar" for="show-menu" class="show-menu">
<img class="icon l" src="/website/img/menu.png" /><img class="icon r" src="/website/img/menu.png" />
MENU
</label>

当我滚动页面时，需要这个来使菜单栏粘稠。 希望得到您的帮助。 谢谢！

Answer 1

你正在定义一个函数AddClass()，但从不调用它。根本不需要定义函数，只需执行函数的作用即可。

如果要指定窗口滚动时应发生的操作，则需要位于scroll事件处理程序中。

function screenClass() {
$(window).off("scroll");
if ($(window).innerWidth() < 484) {
$(window).on("scroll", function() {
if ($(window).scrollTop() > 100) {
$(".show-menu").addClass("sticky");
} else {
$(".show-menu").removeClass("sticky");
}
});
}
}