HPのグローバルナビゲーションのつくりかたについて

締切済

質問者：staircase
質問日時：2012/02/28 12:24
回答数：1件

グローバルナビの形を下記のサイトのようにしたいと考えていますが、どうすれば出来ますでしょうか？参考となる書籍やサイトなどでも結構ですので、教えてください。
（ページのソースをみて、htmlの形は大まかには理解したつもりですが、sccとjavaをどうやって使っているのかがわかりません）

(1)グローバルナビの項目を押すと、下にサブの項目を表示
※ポイントするだけでなく押した時に
(2)サブ項目を表示するときにスライドしながら表示する
(3)サブ項目の分だけ、下にあったものをすべて下げて表示する

ルーブル美術館のサイト
http://www.louvre.fr/jp

通報する

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

質問の本文を隠す

回答 (1件)

最新から表示
回答順に表示

No.1

回答者： ok-rjak
回答日時：2012/03/03 22:42

jQueryとslideToggleを使ってるんじゃないんでしょうか？

大雑把に書きますが、

<script>
function func(num){
　$("menu"+num).slideToggle("slow");
}
</script>

<html>
<ul>
　<li><a href="javascript:void(0);" onclick="func(1);">メニュー1</a></li>
　<li><a href="javascript:void(0);" onclick="func(2);">メニュー2</a></li>
　<li><a href="javascript:void(0);" onclick="func(3);">メニュー3</a></li>
　<li><a href="javascript:void(0);" onclick="func(4);">メニュー4</a></li>
</ul>

<div id="menu1">内容1</div>
<div id="menu2">内容2</div>
<div id="menu3">内容3</div>
<div id="menu4">内容4</div>
</html>

上記のようなものじゃないかと思います。推測ですが・・・
（上記は動作確認をしていません。）

> sccとjavaをどうやって使っているのかがわかりません）

CSSとJavascriptのことですね。
javaと書くとJAVAと勘違いされます。
JAVAとJavascriptは全くの別物なので。

スタイルシートは、どのようなデザインで使うのかによってかわるので、ここでは説明しづらいですね。
ルーブルとまったく同じメニュー、同じサブメニューでいいのなら、なんとか書きようもありますが、それでいいのでしょうか？