[JS]メガドロップダウン型のナビゲーションを実装するスクリプト -Mega Menu
Post on:2010年3月8日
sponsors
豊富なコンテンツを設置できるメガドロップダウンを実装するスクリプトをGeek Tantraから紹介します。
デモでは四種類メガドロップダウンがあり、データ量によってドロップダウンするパネルの幅が成り行きのもの、指定した幅のもの、表示位置が成り行きのもの、右寄せのものがあります。
実装は簡単で、スクリプトを外部ファイルとし、下記のようなスクリプトを記述します。
JavaScript
|
1 2 3 4 5 6 7 8 9 |
<textarea name="code" class="html" cols="60" rows="5"> <script type="text/javascript"> $(document).ready(function(){ $(".MegaMenuLink").megamenu(".MegaMenuContent", { width: "900px" }); }); </script> </textarea> |
ドロップダウンするパネルには自由に要素を配置することが可能で、div要素内に配置します。
Mega MenuはjQueryのプラグインのため、実装にはjquery.jsが必要です。
sponsors
