ホームページの四角いヤツを自分で表記したいです

質問

よくホームページで各ページへのリンクとしてクリックしたら表示されて、またクリックしたら隠れるやつってありますよね？
（わかりにくいと思うので、画像を作ってみました）
あれを自分で作りたいのですが、使っている方のソースを覗いてもそれらしい記述が見当たりません
あれはhtmlでは無いんでしょうか？
なにか別のプログラムで作られている者なんでしょうか？
自分は大枠を３つ。各箇所に２つずつのリンクを入れたいのですが、どういう記述にすればいいのでしょうか？
↓↓↓　こんな感じです
□リンク１
　□リンク１－１
　□リンク１－２
　□リンク１－３
□リンク２
　□リンク２－１
　□リンク２－２
　□リンク２－３
□リンク３
　□リンク３－１
　□リンク３－２
　□リンク３－３

回答No.1

Seravy · ベストアンサー

クリックで表示/非表示を切り替える物ですよね？
そうだと仮定します。

JavaScriptで実現されていると思います。
JavaScriptをご存知なら比較的簡単に実現できますが、経験はありますか？

参考までにサンプルを。
<ul id="menu">
<li><a href="javascript:toggleView('link1')">リンク１</a>
<ul id="link1">
<li>リンク１－１</li>
　 <li>リンク１－２</li>
　 <li>リンク１－３</li>
</ul>
</li>
</ul>

としてスクリプト
function toggleView(objID){
var obj = document.getElementById(objID);
if(obj.style.display != "" || obj.style.display == "none"){
obj.style.display = "block";
} else {
obj.style.display = "none";
}
}

あと、CSS
#menu ul {
display : none;
}

とかでいけるんじゃないでしょうかね。
あと、カテ違いです。

お礼

これはjavaだったんですか。
javaは触ったことは無いんですが、なんとなくイメージはつかめました

<a href="javascript:toggleView('link1')">リンク１</a>
のlink1の部分が変数扱いでいいんですよね？
名前変えたり増やしたりして色々実験してみます

カテはどこに行けばいいかわからなかったのでhtmlの質問があったところと同じカテに投稿させてもらいましたｍ（＿＿）ｍ

早々に回答していただいてどうもありがとうございました

回答No.2

Seravy

JavaではなくJavaScriptですね。

>のlink1の部分が変数扱いでいいんですよね？
大正解です。
この場合、変数に指定されたIDを持つタグ（エレメント）が対象となります。

うっかり判定をミスってるので修正。
if(obj.style.display != "" || obj.style.display == "none"){
は、
if(obj.style.display == "" || obj.style.display == "none"){
の間違いですね；
初期値が無いとき、もしくはdiplayプロパティがnoneの時、表示させ、そうでないとき隠しています。
頑張ってください＾＾

カテゴリーは、
技術者向けー＞プログラミングー＞HTML　とか　同カテゴリのJavaScriptが一番近いんじゃないかと思います。

お礼

あれからjavascriptに付いても少々勉強してみました
今までhtmlが好きで結構弄っていたんですが、javascriptは難しそうで懸念していました。。。。
他国の言語と思いながら根本を理解し始めるとやはり面白いものですね