※ ChatGPTを利用し、要約された質問です(原文:DHTML, テーブルの幅を伸ばすには?)
DHTMLでテーブルの幅を伸ばす方法
このQ&Aのポイント
DHTMLを使用してテーブルの幅を伸ばす方法について解説します。
質問者は、DHTMLを使ったテーブルの幅を伸ばす方法について質問しています。質問者は、コードを記載していますが、IE6でエラーが発生しています。
質問者は、テーブルの幅を伸ばすための関数の修正方法を尋ねています。質問者は、数字をそのまま入れる場合は正常に動作することを確認しています。
以下の code で一応動くものが出来たのですが、
IE6 だと左下のステータスバーにエラーが出てしまいます。
function setWidth2(pixel) {
calc.style.width = pixel;
}
ここに問題があるようですが、数字を
そのまま入れた場合はだいじょうぶなようです。
直し方が解りますでしょうか?
-------------------
<html>
<head>
<title>[ DHTML ]</title>
<script type="text/javascript">
<!--
var w = 200;
var h = 200;
function setWidth(ratio) {
var cur = calc.style.width.substring(0,3);
var set = w*ratio;
var time = 1;
if(cur < set) {
for(i=cur; i<=set; i++) {
setTimeout("setWidth2(" + i + ")",time);
time++;
}
}
else if(cur > set) {
for(i=cur; i>=set; i--) {
setTimeout("setWidth2(" + i + ")",time);
time++;
}
}
}
function setWidth2(pixel) {
calc.style.width = pixel;
}
// -->
</script>
<style type="text/css">
.b1 {
color: "#AFEEEE";
font-size: 24px;
text-align: center;
background-color: white;
}
.button8 {
background-color: white;
cursor: pointer;
}
</style>
</head>
<body><center>
<br>
<table border="0" cellspacing="1" cellpadding="10" bgcolor="#cccccc">
<tr>
<td class="button8">Width</td>
<td class="button8" onMouseDown="setWidth(1.0);">100%</td>
<td class="button8" onMouseDown="setWidth(3.0);">300%</td>
</tr>
</table>
<br>
<table bgcolor="#cccccc" id="calc">
<tr>
<td class="b1"> </td>
</tr>
</table>
</center></body></html>
お礼
ありがとうございます!! うまくいきました^^ calc.style.width はそのオブジェクトの幅を返すと思ってたのですが、 一度設定した後でないと空っぽだったんですね。 結局、onload に function setSize() { setWidth2(w); } を入れることで直せました。 getElementById を使った方が後で解り易そうですね。 ちなみに、もう御存知かもしれませんが こちらの資料は役に立つので参考にしてみてください。 http://msdn.microsoft.com/library/ja/default.asp?url=/library/ja/jpisdk/dhtml/references/dhtmlrefs.asp