jQueryプラグインで彩る，ワンランク上のサイト制作
第5回 メニューを彩るプラグイン（2）
前回に引き続き，Lightbox風プラグイン（jQuery Multi Level CSS Menu，jQuery plugin: Accordion）を紹介していきます。
jQuery Multi Level CSS Menuは横方向のメニューを作るためのプラグインであり，入れ子になったメニューまで表現することができます。
一方，jQuery plugin: Accordionは縦方向のメニューと考えることもできるアコーディオンを実現するためのプラグインとなっています。
jQuery Multi Level CSS Menu
jQuery Multi Level CSS Menuは横方向のメニューを作るためのプラグインです。単に一列にメニューを並べるだけでなく，入れ子になったメニューもドリルダウンする形で表現することができます。
ダウンロード
まずは配布サイトからJavaScript，CSS，画像一式をダウンロードしましょう。
図1 ダウンロード
下記ファイルを，ブラウザから別々にダウンロードする必要があります。
- jquerycssmenu.css
- jquerycssmenu.js
- tintblue.gif
- tintbluedark.gif
- arrow-down.gif
- arrow-right.gif
ダウンロードしたファイルは同一フォルダに置き，その中でHTMLファイルも作成します。また，jQueryのプラグインなので，当然，jQuery本体もダウンロードしておく必要もあります。
図2 フォルダ
HTMLの作成
必要なものをそろえることができたら，次は実際にHTMLを作成していきます。今回は配布サイトのサンプルで紹介されているコードをベースにしたものについて，解説を行っていきます。
図3 サンプル
iret R&D team
iret社内の有志によるインフォーマルな技術者集団。社内の各スペシャリストで構成され，Flash制作からサーバ運用まで，インターネットに関する様々な案件に対し最前線で活躍する。その傍ら，講師業や執筆業なども行っている。
jQueryプラグインで彩る，ワンランク上のサイト制作
- 第5回 メニューを彩るプラグイン（2）
- 第4回 メニューを彩るプラグイン（1）
- 第3回 Lightbox風プラグインでダイアログ表示（2）
- 第2回 Lightbox風プラグインでダイアログ表示（1）
- 第1回 プラグインを見つけよう
![[改訂第3版] SQLポケットリファレンス](http://image.gihyo.co.jp/assets/images/cover/2009/thumb/TH40_9784774138350.jpg){kind=small}
![[改訂3版]図解でよくわかる ネットワークの重要用語解説](http://image.gihyo.co.jp/assets/images/cover/2009/thumb/TH40_9784774138213.jpg){kind=small}
