Javascript 卷轴上的固定div

我正在尝试创建一个div，它将仅在滚动时以及当scroll的值为210时获得一个类。我有下一个代码：

$(document).ready(function() {
    var pageWidth = $(window).width();

    if(pageWidth > 700){
        var contentLeft = $('#content-left');
        var height = 210;

        $(window).scroll(function () {
            if ($(window).scrollTop() < height) {
                contentLeft.attr('class', 'content-left');
            } else {
                contentLeft.attr('class', 'content-left leftContentFixed');
            }
        });
    }
});

比它完美的工作，但与我的代码，它不工作。虽然屏幕小于700，但添加了leftContentFixed类

---

有什么建议吗？

您需要在

resize

事件上检查屏幕大小，并在用户滚动页面时检查其值。您可以创建

mobile

变量，并根据屏幕大小将其设置为

true/false

，然后在

中滚动查看其值并选择正确的类


$（文档）.ready（函数（）{
var pageWidth=$（窗口）.width（），
高度=210，
contentLeft=$（'.content left'），
mobile=false；
$（窗口）.on（'load resize'，function（））{
pageWidth=$（this.width（）；
//保存移动状态
如果（页面宽度>700）{
mobile=false；
}否则{
mobile=true
}
})
$（窗口）.on（'scroll'，function（）{
如果（$（窗口）.scrollTop（）>高度）{
//设置默认类
var _class='content left contentfixed'；
//如果是移动的，则修改类
国际单项体育联合会（流动）{
_class='content left'；
}
contentLeft.attr（'class'，_class）；
}否则{
var_class='content left'；
contentLeft.attr（'class'，_class）；
}
});
});
html{
高度：2000px
}
.剩下的内容{
背景：金；
宽度：50px；
高度：100px；
}
.content-left.leftContentFixed{
位置：固定；
排名：0；
}

还应查看CSS媒体查询，以获得此
leftContentFixed
内容，无需根据视口宽度使用Javascript切换。。。对，除非它只能根据滚动状态应用。它不工作。现在根本没有添加leftContentFixed类。控制台中没有错误。我必须将
$（窗口）.scrollTop（）
更改为
$（窗口）.scrollTop（）>height
。它正在工作。但当我滚动回到页面顶部时，leftContentFixed类仍然存在。@Boky我忘了添加
if
语句，现在应该可以工作了，请看更改的回答我刚刚做了（添加了else语句），它工作得很好。谢谢你，伙计。
$(document).ready(function() {
    var pageWidth = $(window).width();

    if(pageWidth > 700){
        alert("Bigger than 700");
    }else{
        alert("Smaller than 700");
    }
});