使用javascript更改css位置

此代碼完美工作，因爲我的預期，但問題是，當我刷新頁面t_con保持絕對應該被修復，當我調整窗口小於980px，它是絕對像我所需要的如果我再次調整大於980像素，它是固定的。使用javascript更改css位置

我需要它從一開始就保持固定。我不知道它爲什麼是絕對的。

HTML代碼

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

</div> 
</div>

CSS代碼

#t_con{ 
width:100%; 
position:absolute; 
top:0; 
} 
#t{ 
margin:0px auto 0 auto; 
background-color:#976398; 
width:980px; 
height:30px; 
}

JavaScript代碼

window.onresize = function(){ 
var pos = window.outerWidth < 980 ? 'absolute' : 'fixed'; 
document.getElementById('t_con').style.position = pos; 
}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"; 
} 
}

誰能告訴我在做什麼錯在這裏。我不想爲此使用jQuery。所以請不要建議。我不喜歡jQuery的原因是它已經佔用了90kb以及我們正在嘗試執行的代碼。

來源

2013-04-13 Kishore Kumar

't_con.innerWidth'到底是什麼't_con'，你把它命名爲'header'，你可能應該檢查'window'，對不對？ – adeneo

我需要改變它??/ –

得到了答案的傢伙......我在代碼中犯了錯誤，它被adeneo注意到了。 –

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

來源

2013-04-13 01:12:33 Adidi

你能再看一下我的問題嗎？@adidi –

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

FIDDLE

來源

2013-04-13 01:12:19 adeneo

如果我調整窗口大小，它不會改變爲絕對值。它保持不變。 –

你有一個錯字，它是getElementById，最後一個小寫字母d。 – adeneo

哦，謝謝你，我是一個白癡，我犯了這個簡單的錯誤，並且因爲不工作而哭泣。非常感謝。 –

使用javascript更改css位置

回答

相關問題