html内の記述を「表示」「隠す」の切り替え方法について

解決済

質問者：NeuronWhisper
質問日時：2009/03/09 10:07
回答数：4件

お世話になります。

HTMLの文章中に、フラッシュを挿入していますが、必要ない場合に「表示」「隠す」の処理をしたいと考えています。
ウィキペディアではよく利用されていますが、ソースが分かりません。
リファンレンスを探すにも、どう言ったワードで検索してよいのか・・

http://ja.wikipedia.org/wiki/Wikipedia:%E3%82%B5 …

これと同じような動きをするJavascriptのサンプルをご存知ないでしょうか？
よろしくお願いします。

通報する

この質問への回答は締め切られました。

質問の本文を隠す

回答 (4件)

ベストアンサー優先
最新から表示
回答順に表示

No.4ベストアンサー

回答者： fujillin
回答日時：2009/03/10 10:55

No2です。

＞＞最初にdisplayをnoneに設定
↑してないですよね？（表示されてる）

<div id="hoge" style="display:none;">
CSSも覚えてね。

- 0
- 件

通報する

この回答へのお礼

ようやく理解しました。
CSS、もうちょっと勉強します。
ありがとうございます。

通報する

お礼日時：2009/03/10 11:45

No.3

回答者： fujillin
回答日時：2009/03/09 19:28

No2です。

＞でも、デフォルトで非表示だといいのですが、方法はありますか？

ANo2の最初に書いてあるように、単純にCSSのdisplay属性を切り替えているだけなので、最初にdisplayをnoneに設定しておいてあげればいいです。

この回答への補足

いろいろソースをいじってみたのですがわかりません。
こういうことでしょうか？

<html>
<head>
<script type="text/javascript">
function fuga(elm) {
var flag = (elm.innerHTML=='隠す');
document.getElementById('hoge').style.display = flag?'none':'block';
elm.innerHTML = flag?'表示':'隠す';
}
</script>
</head>
<body>
<button onclick="fuga(this)">表示</button>
<p>
<div id="hoge">
なんたらかんたら説明文<br>
画像なんかもあったりして
</div>
</body>
</html>

1さんのリンク先はソースが複雑で、２さんのソースがシンプルで分かりやすいのですが・・・よろしくお願いします。

補足日時：2009/03/10 09:28

通報する

- 0
- 件

通報する

No.2

回答者： fujillin
回答日時：2009/03/09 12:31

CSSのdisplayやvisibilityを切り替えてやっているのが多いみたい。

＜参考まで＞
<html>
<head>
<script type="text/javascript">
function fuga(elm) {
var flag = (elm.innerHTML=='表示');
document.getElementById('hoge').style.display = flag?'block':'none';
elm.innerHTML = flag?'隠す':'表示';
}
</script>
</head>
<body>
<button onclick="fuga(this)">隠す</button>
<p>
<div id="hoge">
なんたらかんたら説明文<br>
画像なんかもあったりして
</div>
</body>
</html>