2012-08-06 4 views
5

このコードは要素の高さを設定する必要があります。スタイルは追加されません。私は明白な何かを欠いていますかJavascriptを使用して高さを設定する

function setGround() { 
    document.getElementById('content').style.height = '40px'; 
} 

document.onload = setGround; 

HTMLは非常に基本的なものです:

<!DOCTYPE html> 
<head> 
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
    <title>Template</title> 
    <link rel="stylesheet" type="text/css" href="css/default.css"/> 
    <link rel="stylesheet" type="text/css" href="css/orange.css"/> 
    <script type="text/javascript" src="javascript/detect-css.js"></script> 
</head> 

<body> 
    <header> 
     <div id="logo"></div> 
    </header> 
    <section id="sidebar"><p>sf </p> 
    </section> 

    <section id="content"><p>sf </p> 
    </section> 

</body> 
</html> 

はあなたの助けをありがとう!

+1

window.onLoad = setGround; 

を使用する必要があります。それでは 'setGround()'を実行するだけです。 –

答えて

4

代わりにdocument.onloadを使用しないでください。window.onloadを使用してください。

あなたは、この使用することができますhttp://jsfiddle.net/mowglisanu/r6NzE/

+0

作品!ありがとうございました!違いを教えてください。 – cmplieger

+0

このディスカッションでは、この話をしています。http://stackoverflow.com/questions/588040/window-onload-vs-document-onload – MattK311

2

参照してください:

function setGround() { 
    document.getElementById('content').style.height = '40px'; 
} 
document.onload = setGround; 

をしかし、あなたが変更を確認したい場合は、あなたが使用することによって、このセクションタグの境界線を作成する必要があります:あなたが持っている

<section id="content" style='border:1px solid fuchsia;' > 
<p>sf </p> 
</section>  
0

をjavascriptコードを配置しましたか? detect-css.jsにありますか?

これは動作します:

<head> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
<title>Template</title> 
<link rel="stylesheet" type="text/css" href="css/default.css"/> 
<link rel="stylesheet" type="text/css" href="css/orange.css"/> 
<script language="javascript"> 
function resize(){ 
document.getElementById("content").style.height='100px'; 
} 
</script> 
</head> 

<body onload="resize()"> 
<header><div id="logo"></div></header> 
<section id="sidebar"><p>sf </p> 
</section> 

<section id="content" style="background-color:#CCC; display:block;"><p>sf </p> 
</section> 

</body> 
</html> 
1

あなたは非常に簡単な解決策は、単に ``タグの前にスクリプトを置くことです代わりに

document.onload = setGround; 
関連する問題