• 締切済み

jQueryプラグインのメガドロップダウンメニュー

jQueryプラグインのメガドロップダウンメニューについて 当方プログラミング初心者です。 至らない点ばかりですが、どうかご容赦ください。。。 この度、仕事でこのメガドロップダウンメニューを使用することになりました。 サンプルサイトです→(1)http://www.designchemical.com/lab/jquery-mega-drop-down-menu-plugin/advanced-styling/# (2)http://www.designchemical.com/lab/jquery-mega-drop-down-menu-plugin/download/ 使用したいのは、 (1)にあるサンプル(オンマウスすると車の写真などが出てくる) スタイルは(2)にある、白色のバー なのですが、どうもうまくいきません・・・ 上記サイトからダウンロードしたもの ・jquery.js ・jquery.dcmegamenu.1.3.3.js ・dcmegamenu.css ・white.css その他素材などが、指定した名前のフォルダに入っています。 英語が読めないので、わからない単語は調べたりしてなんとかメニューとして形にはできたのですが バーの色は黒いままだし、まずドロップダウンしません。 今、この状態のまま詰まってしまっています・・・ たぶんめちゃくちゃになってしまっていると思うのですが、 どこが悪いのかわかりません・・・>< ★HTML(ヘッド) <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" ~~~ <head> <link rel="stylesheet" href="css/white.css" type="text/css" /> <script type="text/javascript" src="jquery/jquery.js"></script> <link rel="stylesheet" href="css/dcmegamenu.css" type="text/css" /> <script type="text/javascript" src="jquery/jquery.dcmegamenu.1.3.3.js"></script> <script type="text/javascript"> $(document).ready(function($){ $("mega-menu").dcMegaMenu({ rowItems: "3", speed: "fast" }); }); </script> </head> ★HTML(ボディ) <div class="dcjq-mega-menu demo-container"> <ul id="mega-menu" class="menu"> <li><a href="#">Home</a></li> <li><a href="#">Vehicles</a> <ul> <li id="menu-item-1"><a href="#">Coupe</a> <ul> <li><a href="#">Citroen C4</a></li> <li><a href="#">Honda CR-Z</a></li> <li><a href="#">BMW 3 Series</a></li> <li><a href="#">Volvo C30</a></li> </ul> </li> <li id="menu-item-2"><a href="#">Saloon</a> <ul> <li><a href="#">Volkswagen Passat</a></li> <li><a href="#">Volvo S40</a></li> <li><a href="#">Vauxhall Insignia</a></li> <li><a href="#">Mitsubishi Lancer</a></li> </ul> </li> ~~~~~~~~省略 <li id="menu-item-6"><a href="#">High Performance Cars</a> <ul> <li><a href="#">Lamborghini Gallardo</a></li> <li><a href="#">Ferrari F430</a></li> <li><a href="#">Aston Martin Vantage</a></li> <li><a href="#">Porsche 911 Turbo</a></li> </ul> </li> </ul> </li> <li><a href="#">About Us</a> <ul> <li><a href="#">About Us</a></li> <li><a href="#">About Us</a></li> </ul> </li> <li><a href="#">Services</a></li> <li><a href="#">Contact us</a></li> </ul> </div> 名前はまだサンプル通りです。 ★CSS(1)(dcmegamenu.css) http://www.designchemical.com/lab/jquery-plugins/jquery-mega-drop-down-menu/css/dcmegamenu.css ★CSS(2)(white.css) http://www.designchemical.com/lab/jquery-plugins/jquery-mega-drop-down-menu/css/skins/white.css つっこみ所だらけかと思います・・・すみません・・・ どこが悪いのでしょうか・・・? 私のような初心者にはまだまだ早いプログラミングなのかもしれませんが、 どうか、お力添えをお願いできれば、、、、お願いします。

みんなの回答

noname#209234
noname#209234
回答No.1

色々とありますが・・・まず、ロード時の設定が動いてないかと・・・ jQueryでID指定の場合 $("#ID")です。 ですから $("#mega-menu").dcMegaMenu({ となります。 FireFox使ってるならFireBug入れてデバッグ作業しながら進めてください、IEならF12押すと開発者ツールっていってデバッガー出ます。あと、クロームもデバッガーついてますからそこでエラー文見ながら一つづつ潰してください・・・ あと、DLした際についてきた[index.html]ってあると思いますが、あれ見ながら再度勉強しながらやりましょう・・・

すると、全ての回答が全文表示されます。

関連するQ&A