Javascript 在调整大小刷新时清除Jquery css更改

你可以从我的例子中看到。我试图使它，以便当窗口被重新大小低于1000px；CSS被清除，以便我的.CSS文件可以接管

如果窗口大小开始小于1000px，则它可以工作，但反之亦然

$(window).resize(function(){

   if ($(window).width() >= 1000) {  

        var length = $('#left').height() - $('#sidebar').height() + $('#left').offset().top;

$(window).scroll(function () {

    var scroll = $(this).scrollTop();
    var height = $('#sidebar').height() + 'px';

    if (scroll < $('#left').offset().top) {

        $('#sidebar').css({
            'position': 'absolute',
            'top': '0'
        });

    } else if (scroll > length) {

        $('#sidebar').css({
            'position': 'absolute',
            'bottom': '0',
            'top': 'auto'
        });

    } else {

        $('#sidebar').css({
            'position': 'fixed',
            'top': '0',
            'height': height
        });
    }
});

   }   
    else if ($(window).width() <= 1000) {
    $('#sidebar').css({
    'position': '',
    'bottom': '',
    'top': ''
     });
     $('#left').css({
    'position': '',
    'bottom': '',
    'top': ''
     });
    }

});

$（窗口）。调整大小（函数（）{
如果（$（window）.width（）>=1000）{
变量长度=$（“#左”）.height（）-$（“#侧边栏”）.height（）+$（“#左”）.offset（）.top；
$（窗口）。滚动（函数（）{
var scroll=$（this.scrollTop（）；
变量高度=$（“#边栏”）.height（）+“px”；
如果（滚动<$（'#左'）.offset（）.top）{
$（“#侧边栏”）.css({
'位置'：'绝对'，
“顶部”：“0”
});
}else if（滚动>长度）{
$（“#侧边栏”）.css({
'位置'：'绝对'，
“底部”：“0”，
“顶部”：“自动”
});
}否则{
$（“#侧边栏”）.css({
'位置'：'固定'，
“顶部”：“0”，
“高度”：高度
});
}
});
}   
else if（$（window）.width（）我认为代码的主要问题不是它的工作方式，因为滚动函数在window resize函数中；我认为您只需要将这些内容混匀一点：

$(window).scroll(function () {

    if ($(window).width() >= 1000) {

        var length = $('#left').height() - $('#sidebar').height() + $('#left').offset().top;

        var scroll = $(this).scrollTop();
        var height = $('#sidebar').height() + 'px';

        if (scroll < $('#left').offset().top) {

            $('#sidebar').css({
                'position': 'absolute',
                'top': '0'
            });

        } else if (scroll > length) {

            $('#sidebar').css({
                'position': 'absolute',
                'bottom': '0',
                'top': 'auto'
            });

        } else {

            $('#sidebar').css({
                'position': 'fixed',
                'top': '0',
                'height': height
            });
        }
    }
});

$(window).resize(function(){

    if ($(window).width() < 1000) {
        $('#sidebar').css({
            'position': '',
            'bottom': '',
            'top': ''
         });
         $('#left').css({
            'position': '',
            'bottom': '',
            'top': ''
        });
    }

});

$（窗口）。滚动（函数（）{
如果（$（窗口）.width（）>=1000）{
变量长度=$（“#左”）.height（）-$（“#侧边栏”）.height（）+$（“#左”）.offset（）.top；
var scroll=$（this.scrollTop（）；
变量高度=$（“#边栏”）.height（）+“px”；
如果（滚动<$（'#左'）.offset（）.top）{
$（“#侧边栏”）.css({
'位置'：'绝对'，
“顶部”：“0”
});
}else if（滚动>长度）{
$（“#侧边栏”）.css({
'位置'：'绝对'，
“底部”：“0”，
“顶部”：“自动”
});
}否则{
$（“#侧边栏”）.css({
'位置'：'固定'，
“顶部”：“0”，
“高度”：高度
});
}
}
});
$（窗口）。调整大小（函数（）{
如果（$（窗口）.width（）<1000）{
$（“#侧边栏”）.css({
“位置”：“，
“底部”：“，
“顶部”：”
});
$（'#左'）.css({
“位置”：“，
“底部”：“，
“顶部”：”
});
}
});
只是好奇：有什么理由不使用CSS3媒体查询而不是jQuery来执行所有这些操作吗？除了将css属性设置为空字符串，您还可以简单地删除style属性吗？例如：
$（'#左，#侧栏'）。removeAttr（'style'））
如果可以的话，请相信我，我本来会这样做的。主要问题是，如果你将某个东西设置为position:relative，它会忽略上面的东西，如果这样做有意义的话。切换类通常是更简单的方法Yes$（“#左，#侧栏”）。removeAttr（'style'）；有效。谢谢。这很好。谢谢。虽然它给了我另一个奇怪的问题。<1009px没有解决。是的，让我上传它，我没想到你会回复。再次感谢。奇怪的是，如果我把它改成>=970，它有效。我有标准的@media引导，唯一的改变是在992px没有问题！不喜欢离开东西不完整…；-）你能把它改回1000，这样我就能看到错误了吗？当我下载代码并在本地更改时，它工作得很好。另外，你使用的是什么浏览器？我使用的是chrome，改成了1000