Javascript结果与css的预期不符ECD

这段代码和我预期的一样完美，但问题是当我刷新页面时，t_con保持为绝对值，这应该是固定的，当我将窗口调整到小于980px时，它是绝对值，就像我需要的一样，如果我再次调整大小超过980px，它就会被固定

我需要它从一开始就保持固定。我不知道为什么一开始它是绝对的

HTML代码

<div id="t_con">
    <div id="t">

    </div>
</div>

Javascript代码

window.onresize = function(){
    var header = document.getElementById('t');
    var window_width = document.body.offsetWidth;
    if(window_width < 980) {
        header.style.position = "absolute";
    } else {
        header.style.position = "fixed";
    }
}

window.onresize=function（）{
var header=document.getElementById（'t'）；
var window_width=document.body.offsetWidth；
如果（窗宽<980）{
header.style.position=“绝对”；
}否则{
header.style.position=“固定”；
}
}

---

谁能告诉我这里做错了什么？我不想用jQuery来处理这个问题。所以请不要建议。我不喜欢jQuery的原因是它已经需要90kb加上我们试图执行的代码。

您正在设置

窗口。onresize

两次，这样您的第一个函数就永远不会被调用

尝试：

window.onresize=function（）{
document.getElementById（'t_con'）。style.position=window.outerWidth<980？'absolute'：'fixed'；
document.getElementById（'t'）。style.position=document.body.offsetWidth<980？'absolute'：'fixed'；
}

你应该喜欢jQuery。。。这是可怕的，简单和有效的…我编辑了我的代码。我还有一个问题，如果我禁用javascript，我需要刷新页面，使其成为绝对的，就像在css中一样。有没有不刷新页面的方法呢？你是怎么禁用javascript的？您的意思是删除事件处理程序吗？在浏览器中禁用javascript。某些用户将禁用其javascript。对于他们来说，在没有页面刷新的情况下，它应该是绝对的。我对这段代码运行了一个测试，它工作正常，然后我在浏览器中禁用了javascript，它保持不变，直到我刷新页面后，它变为绝对。我希望这种情况在没有刷新的情况下发生，我会添加

位置：绝对到你的标题，所以当js被禁用时它是默认的。除此之外，对于用户在站点上禁用javascript，您无能为力。他们为什么要这么做？
window.onresize = function(){
    var header = document.getElementById('t');
    var window_width = document.body.offsetWidth;
    if(window_width < 980) {
        header.style.position = "absolute";
    } else {
        header.style.position = "fixed";
    }
}

window.onresize = function(){               
    document.getElementById('t_con').style.position = window.outerWidth < 980 ? 'absolute' : 'fixed';
    document.getElementById('t').style.position = document.body.offsetWidth < 980 ? 'absolute' : 'fixed';
}