ボタン押下等のトリガで、既に表示されているTABLEのセル(TDエレメントね)を
動的にcolspanで結合させたいのですが、方法が分かりません。
ブラウザはIEオンリーなのでDHTMLでもなんでもOKです。

ご存知の方、どうぞよろしくおねがいします。

A 回答 (1件)

できません。

(自信90%)
例えば、「結合する前のテーブル」と「セルを結合した後のテーブル」をそれぞれ、あらかじめ<DIV>で囲んで用意し、後者をvisibility="hidden"にしておく。
JavaScript:Onclickで前者、後者をスワップする。
という方法で出来なくはないです。苦肉です。
    • good
    • 0
この回答へのお礼

さっそくの御回答、ありがとうございました。
そうですか、できませんか・・・
画像を一切使わず、動的に棒グラフを書きたいのでこの質問をさせていただきました。
棒グラフ上に文字も載せるため、セルの結合がしたかったのですよ。
上記要件を満たす棒グラフってどうやったら描けるのでしょうか。
ご存知の方、どうぞよろしくおねがいします。

スレッド、変えなきゃいけないかなぁ・・・

お礼日時:2001/04/13 16:19

お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!

このQ&Aを見た人はこんなQ&Aも見ています

このQ&Aを見た人が検索しているワード

このQ&Aと関連する良く見られている質問

Q庭の土を固めるならアスファルトに限る

庭の土を固めるならアスファルトに限る

庭の土って放置してむきだしにしておくと
雑草がもりもりはえてくるよね。

なので、コンクリートとか、アスファルトで
固めてしまうのがはやってるんだけど、
そのとき、コンクリートと、アスファルトとで、
どっちを選んだらいいのか、悩むことってないかな?

そんなときは、問答無用で、アスファルトで決まりだ!

なぜなら、雪がふったとき、融雪剤ってまくよね。
あの融雪剤って、成分は塩なのです。

そしてコンクリートに塩は大敵。
ぼろぼろにくさっちゃいます。

でも、なぜかアスファルトだと塩をまきまくっても
ぜんぜんだいじょうぶなのです。

だから、雪の降る地域では、
融雪剤をまくことまで考えに入れて、
アスファルトを選ぶことをおすすめします、、、


、、、この理解であってる?

Aベストアンサー

融雪剤をコンクリートに撒けば、凸凹になりますよ。
石がこんにちは!って顔を出します。
かるーく撒く分には支障ありませんが、多量に撒けば
凹ができます。
それ以降、かるーく撒くようにしています。
融雪剤を舐めれば分かるのですが、しょっぱいというより、舌が痛いです。
塩は、塩化ナトリウムであって、塩化カルシウムと違う。
コンクリート道路にはかるーく融雪剤をまいているのでしょうし、
防波堤が何十年と形をなしているのは、海水の濃度が融雪剤とはケタが違うほど薄いのではないでしょうか。
素人ですが、北国で融雪剤を使うと、コンクリートが凸凹になる意見は賛成です。

Qtdの中のtableの中のtd

.box{~~}
という具合にfont-sizeやline-heightを
スタイルシートで定義しています。

あるtdの中に<td class="box">で
そのスタイルを適用させるまではいいのですが、
そのtdの中にさらにtableを作った場合、
その中にはboxスタイルが適用されません。

入れ子になっている影響かな?とは思うのですが、
この場合、どう指定したらよいのでしょうか。
すべてのtdにclass指定するのは避けたいです。

Aベストアンサー

#1の方の回答にある、テーブルに直接クラス指定する方法の他に、boxクラスに含まれる要素に対する特定の要素にも指定を追加するセレクタを記述する方法も使えると思います。

.box{~~}

これを

.box, .box td{~~}

とすると、boxクラスの要素の中に含まれているtd要素にも同じスタイルシートを適用するようになると思います。

他に、DOCTYPEスイッチを使って、ブラウザでのスタイルシートの適用方法を変えることでも対処できるかもしれません。 この場合は、HTMLファイルの<HTML>タグの前に、省略なしで下記のDOCTYPE宣言を記述します。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

こうすると、スタイルシートの適用範囲が標準モードになり、特に細工をしないでもboxクラスの要素内のテーブルにもboxのスタイルが適用されると思います。
ただ、こちらの方法を使うと、全体的にスタイルシートの適用方法が変わるので、他の調整も必要になるかもしれません。

参考まで。

#1の方の回答にある、テーブルに直接クラス指定する方法の他に、boxクラスに含まれる要素に対する特定の要素にも指定を追加するセレクタを記述する方法も使えると思います。

.box{~~}

これを

.box, .box td{~~}

とすると、boxクラスの要素の中に含まれているtd要素にも同じスタイルシートを適用するようになると思います。

他に、DOCTYPEスイッチを使って、ブラウザでのスタイルシートの適用方法を変えることでも対処できるかもしれません。 この場合は、HTMLファイルの<HTML>タグの前に、省略...続きを読む

Q土を固める雑草対策

家の周りの雑草に悩み、土を固めることにしました。

1.市販の固まる砂
2.既存の土にセメントを数%混ぜて固める
3.既存の土に消石灰を混ぜるて固める
…等を考えていますが、

それぞれの耐久性や本当に雑草が生えないかという疑問が沸いています。
1と2に色以外の違いはあるのでしょうか?

それぞれのメリット・デメリットをご教示いただきたいです。
よろしくお願いします。

Aベストアンサー

「1」はよく通販で「やさし砂かまいらず」というのが紹介されていますね。
効果のほどは不明ですが、テレビでは愛・地球博でも使われていた、と謳っていますね。

「2」「3」は効果はないでしょう。
「2」に関しては、地盤改良(地盤沈下を防ぐ)するために用いる方法ですね。

ただそれよりも、地面を「玉竜」で覆ってしまった方が効果的だと思います。
他の植物を群生させて雑草が生えて来れないようにする方が見栄えもよいです。うちの会社の花壇でもそうしています。

Q[table] colspanについて

画像添付にあるようなセル区切りのtableをhtmlで作成したいと考えています。

4列目にセルが4つあるので、3列目のcolspanの指定をどのように記述すればいいのか
不明で困っています。

----------------------------------------------------
<table>
<tr>
<th></th>
<th colspan="3"></th>
</tr>
<tr>
<td></td>
<td colspan="3"></td>
</tr>
▼▼▼▼▼この列のrowspanの指定がわからない▼▼▼▼▼
<tr>
<td></td>
<td></td>
<td></td>
</tr>
▲▲▲▲▲この列のrowspanの指定がわからない▲▲▲▲▲
<tr>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td></td>
<td colspan="3"></td>
</tr>
</table>
----------------------------------------------------

どなたか解決案をご存知の方、お教えいただけないでしょうか?

colspanにこだわっているわけではないので、cssで解決できるのであればcssでも大丈夫です。
よろしくお願い致します。

画像添付にあるようなセル区切りのtableをhtmlで作成したいと考えています。

4列目にセルが4つあるので、3列目のcolspanの指定をどのように記述すればいいのか
不明で困っています。

----------------------------------------------------
<table>
<tr>
<th></th>
<th colspan="3"></th>
</tr>
<tr>
<td></td>
<td colspan="3"></td>
</tr>
▼▼▼▼▼この列のrowspanの指定がわからない▼▼▼▼▼
<tr>
<td></td>
<td></td>
<td></td>
</tr>
▲▲▲▲▲この列のrowspanの指定がわからない▲▲▲▲▲
<tr>
<td></td>
<td></td>
<td...続きを読む

Aベストアンサー

<table>
<tr>
<th></th>
<th colspan="6"></th>
</tr>
<tr>
<td></td>
<td colspan="6"></td>
</tr>
<tr>
<td></td>
<td colspan="3"></td>
<td colspan="3"></td>
</tr>
<tr>
<td></td>
<td colspan="2"></td>
<td colspan="2"></td>
<td colspan="2"></td>
</tr>
<tr>
<td></td>
<td colspan="6"></td>
</tr>
</table>

……ところで、なぜこのような表を作る必要が出てきたのでしょうか?

Q土を固める方法

庭の一部を雑草防止に土を固めたいのですが、あれって単純にセメントと土を混ぜればできるものですか

Aベストアンサー

>セメントと土を混ぜればできるものですか

そんな工法は無いでしょう

・土を突き固める
・固まる砂で施工する
http://www.oniwayasan.com/commodity/index.html
・シートを敷き、砂利でも入れる
http://www.rakuten.co.jp/kumanokodou/546954/582761/

今後そこに何も植えないなら塩水を撒きながら土を固めれば雑草は生えません(あまりお勧めできませんが)

Qの colspanについて

<table border=1>
<tr><td colspan=2>aaaaaaaaaaaaaaaaa</td></tr>
<tr><td colspan=2>aaaaaaaaaaaaaaaaaa</td></tr>
<tr><td>aa</td><td>bb</td></tr>
<tr><td colspan=2>aaaaaaaaaaaaaaaaaaaaaaaa</td></tr>
</table>

の3行目の(分割している)2つのセルの幅を自由に設定したいのですが、width=10%などといれてもうんともすんともしません。なにかいい方法ありますか?

Aベストアンサー

できますよ。以下の様に試してみたらできました。
<html>
<head>
</head>
<body>
<table border=1>
<tr><td colspan=2>aaaaaaaaaaaaaaaaa</td></tr>
<tr><td colspan=2>aaaaaaaaaaaaaaaaaa</td></tr>
<tr><td width = "10%">aa</td><td>bb</td></tr>
<tr><tdcolspan=2>aaaaaaaaaaaaaaaaaaaaaaaa</td></tr>
</table>
</body>
</html>

Q食用油を ゼリー状に固める方法はありませんか?

食用油をゼリー状に固める方法はないでしょうか? 固めるテンプル等 使用後に油を捨てるために固める方法はありますが 今回は固めた油を食用に使用したいのです。
寒天、ゼラチン等で試してみましたが うまく固まりません。
何か良い方法がありましたら情報を頂きたく よろしくお願い致します。

Aベストアンサー

液体の油脂と固体の油脂の違いは学ばれたと思います。
不飽和度の高い--二重結合の多い--油脂は融点が低くなります。
いずれも炭素数18の脂肪酸ですが、(炭素数-ニ集結合の数)
ステアリン酸(18-0) 融点 約70℃ ⇒http://ja.wikipedia.org/wiki/%E3%82%B9%E3%83%86%E3%82%A2%E3%83%AA%E3%83%B3%E9%85%B8
オレイン酸(18-1)  融点 約16℃ ⇒http://ja.wikipedia.org/wiki/%E3%82%AA%E3%83%AC%E3%82%A4%E3%83%B3%E9%85%B8
リノール酸(18-2)  融点 約-5℃ ⇒http://ja.wikipedia.org/wiki/%E3%83%AA%E3%83%8E%E3%83%BC%E3%83%AB%E9%85%B8
リノレン酸(18-3)  融点 約-11℃ ⇒http://ja.wikipedia.org/wiki/%CE%91-%E3%83%AA%E3%83%8E%E3%83%AC%E3%83%B3%E9%85%B8

寒天、ゼラチンは、ゲル( http://ja.wikipedia.org/wiki/%E3%82%B2%E3%83%AB )による固化で、原理がまるで異なります。

 固めるテンプルもたぶんステアリン酸などの飽和脂肪酸を加えていくのでしょう。

 液体の油脂の固化には、植物油からバターを作る方法あたりで学ばれたと思いますが、水素化(亜鉛などの触媒を使って水素を添加する)が一般的ですが、設備が必要ですし、トランス脂肪酸( http://ja.wikipedia.org/wiki/%E3%83%88%E3%83%A9%E3%83%B3%E3%82%B9%E8%84%82%E8%82%AA%E9%85%B8 )が発生する問題もあります。
 もうひとつの方法が、固形の脂肪酸を加える方法です。その代表的な手法が固めるテンプルですが、これは食品用途ではありませんので、ヘッド、ラードなど動物性油脂、もしくは食品用に生成されたステアリン酸などを加えることになると思います。

 原理的にはできなくもないですが、最初から固形の油脂を使うほうが良いです。

液体の油脂と固体の油脂の違いは学ばれたと思います。
不飽和度の高い--二重結合の多い--油脂は融点が低くなります。
いずれも炭素数18の脂肪酸ですが、(炭素数-ニ集結合の数)
ステアリン酸(18-0) 融点 約70℃ ⇒http://ja.wikipedia.org/wiki/%E3%82%B9%E3%83%86%E3%82%A2%E3%83%AA%E3%83%B3%E9%85%B8
オレイン酸(18-1)  融点 約16℃ ⇒http://ja.wikipedia.org/wiki/%E3%82%AA%E3%83%AC%E3%82%A4%E3%83%B3%E9%85%B8
リノール酸(18-2)  融点 約-5℃ ⇒http://ja.wikipedia.org/wiki/%E3%83%AA%E3%83%8E%E3%8...続きを読む

QIE6 バグ table td colspan paddingの組み合わせ

Internet Explorer6ではテーブルにCOLSPANが指定されたセルが含まれるとcolspanを含まないセルの幅の指定がずれるというバグがあるようです。

特にこのバグは、テーブルの一段目の行の全てのセルがcolspanで結合され一つのセルになっている場合、顕著に現われるようです。

このバグは、テーブルに含まれる全てのセルにwidthを指定することである程度防げるようですが、全てのセルにwidthを指定しても、一段目のcolspanのあるセルの左右にcssでpaddingを指定しているとそのテーブルのcolspanを含まないセル(一段目以降のセル)の幅がずれてしまいます。

このバグをどのようにして回避するか、ご存知の方はおられますか?
よろしくお願いします。

キャサリン

Aベストアンサー

こんにちわ。

>一段目のcolspanのあるセルの左右にcssでpaddingを指定していると・・・

IEのpadding解釈はおかしいです。
出来るだけ、IEでpaddingは使わない方がいいかもしれません。

さて、上記のことですが Colspanセル に padding を適用するということは、中身の左右や上下に空間を作りたいということですよね?
それも、<table>全体のセルではなくそのセルだけに。

こういう方法はどうでしょうか?
<tr>
<td colspan="2" width=200px>
<div style="width:180px;maegin:10px;">中身</div>
<td>
</tr>
<tr>
<td width=100px></td>
<td width=100px></td>
</tr>

つまりColspanの中身を<div>タグでくくり、そのDIVの外側の余白として margin で余白を指定するというやり方です。
モチロン、Colspanのセル幅に対して余白分を考えた<DIV>の横幅に設定してくださいね。

こんにちわ。

>一段目のcolspanのあるセルの左右にcssでpaddingを指定していると・・・

IEのpadding解釈はおかしいです。
出来るだけ、IEでpaddingは使わない方がいいかもしれません。

さて、上記のことですが Colspanセル に padding を適用するということは、中身の左右や上下に空間を作りたいということですよね?
それも、<table>全体のセルではなくそのセルだけに。

こういう方法はどうでしょうか?
<tr>
<td colspan="2" width=200px>
<div style="width:180px;maegin:10px;">中身</...続きを読む

Q「蒸して固めるプリン」と、「冷やして固めるプリン」、どちらが好きですか?

掲題の通りですが、子供の頃、「プリンの素」みたいなもので作るプリンは冷蔵庫で冷やして固めていましたが、その後、プリンは蒸して作る方法もあることを知って、すごく驚きました。
食感も味も大分違いますね。

そこで皆さんは、「蒸して固めるプリン」と「冷やして固めるプリン」
どちらが好きでしょうか?

Aベストアンサー

地獄蒸しプリン大好き人間としては、断然「蒸して固めるプリン」です!

Qtableにtable。table同士の間隔を拡大

スクロールバーを付けるためにtable内にtableを入れました。
中のtableとtableの間隔を開けたいです。
言葉が少ないですが、その分画像で頑張って説明します。
お願いいたします。
<style type="text/css">
#test0{
cellpadding: 2;
width: 518px;
background-color : #fff;
border:1px solid #333;
border-spacing:0;
}

#start{
width: 495px;
height: 230;
border-top:1px solid #333;
border-left:1px solid #333;
border-right:1px solid #333;
border-bottom:1px solid #ff0000;
}

.center{
width: 495px;
height: 230;
border-top: 0;
border-left:1px solid #333;
border-right:1px solid #333;
border-bottom:1px solid #ff0000;
}

#end{
width: 495px;
height: 230;
border-top: 0;
border-left:1px solid #333;
border-right:1px solid #333;
border-bottom:1px solid #40ee22;
}

td.test1{
background-color: #000000;
color: #333333;
}

td.test2 img{
margin: 10px;
}

.test3{
font-size: 12px;
padding: 5px;
}

td.test4{
text-align: center;
}
</style>
<table id="test0">
<tbody>
<tr>
<td>
<DIV style="height:400px; overflow:auto;">

<table id="start">
<tr>
<td class="test1" colspan="3">タイトル</td>
</tr>
<tr>
<td class="test2" rowspan="2"><img src="test.jpg" width="100" height="80"></td>
<td class="test3" colspan="2">テストテストテストテストテストテスト</td>
</tr>
<tr>
<td class="test4">left</td>
<td class="test4">right</td>
</tr>
</table>

<table class="center">
<tr>
<td class="test1" colspan="3">タイトル</td>
</tr>
<tr>
<td class="test2" rowspan="2"><img src="test.jpg" width="100" height="80"></td>
<td class="test3" colspan="2">テストテストテストテストテストテスト</td>
</tr>
<tr>
<td class="test4">left</td>
<td class="test4">right</td>
</tr>
</table>

<table id="end">
<tr>
<td class="test1" colspan="3">タイトル</td>
</tr>
<tr>
<td class="test2" rowspan="2"><img src="test.jpg" width="100" height="80"></td>
<td class="test3" colspan="2">テストテストテストテストテストテスト</td>
</tr>
<tr>
<td class="test4">left</td>
<td class="test4">right</td>
</tr>
</table>
</div>
</td>
</tr>
</tbody>
</table>

スクロールバーを付けるためにtable内にtableを入れました。
中のtableとtableの間隔を開けたいです。
言葉が少ないですが、その分画像で頑張って説明します。
お願いいたします。
<style type="text/css">
#test0{
cellpadding: 2;
width: 518px;
background-color : #fff;
border:1px solid #333;
border-spacing:0;
}

#start{
width: 495px;
height: 230;
border-top:1px solid #333;
border-left:1px solid #333;
border-right:1px solid #333;
border-bottom:1px solid #ff0000;
}

.center{
width: 495px;
...続きを読む

Aベストアンサー

<h1>サンプル</h1>
<div class="product">
<div class="section"><!-- HTML5ではsectionという要素になる -->
<h2>タイトル</h2>
<ul>
<li class="photo"><img src="sample.jpg" width="100" height="80" alt=""></li>
<li class="caption">テストテストテストテストテストテスト</li>
<li><span class="price">価格</span><span class="stock">在庫</span></li>
</ul>
</div>
<div class="section">
<h2>タイトル</h2>
<ul>
<li class="photo"><img src="sample.jpg" width="100" height="80" alt=""></li>
<li class="caption">テストテストテストテストテストテスト</li>
<li><span class="price">価格</span><span class="stock">在庫</span></li>
</ul>
</div>
<div class="section">
<h2>タイトル</h2>
<ul>
<li class="photo"><img src="sample.jpg" width="100" height="80" alt=""></li>
<li class="caption">テストテストテストテストテストテスト</li>
<li><span class="price">価格</span><span class="stock">在庫</span></li>
</ul>
</div>
</div>
</body>
</html>

<h1>サンプル</h1>
<div class="product">
<div class="section"><!-- HTML5ではsectionという要素になる -->
<h2>タイトル</h2>
<ul>
<li class="photo"><img src="sample.jpg" width="100" height="80" alt=""></li>
<li class="caption">テストテストテストテストテストテスト</li>
<li><span class="price">価格</span><span class="stock">在庫</span></li>
</ul>
</div>
<div class="section">
<h2>タイトル</h2>
<ul>
<li class="photo"><img src="sample.jpg" width="100" height="80" alt=""></li>
<li c...続きを読む


このQ&Aを見た人がよく見るQ&A

人気Q&Aランキング

おすすめ情報