JavaScript + Ajax 実践サンプル集 (1127本以上) ◇編集して実行可能◇
jQueryを使い倒せ! jQueryでAjaxを実装するための基礎知識と実践サンプルを一挙公開中...
ホーム
jQuery
jQuery プラグイン
jQuery UI
人気順
カテゴリ
キーワード
クール
新着
ツリー
jQuery PDF
ホット
サイト情報
サイトマップ
★ 新着サンプルトップ50のRSSを購読する
◆ DHTMLサンプル(基礎)のRSSを購読する
◆ DHTMLサンプル(応用)のRSSを購読する
◆ AJAXサンプルのRSSを購読する
◆ その他サンプルのRSSを購読する
◆ BOM(Browser Object Model)のRSSを購読する
◆ DOM(Document Object Model)のRSSを購読する
jQueryのjdMenuプラグインを利用したドロップダウンメニュー(垂直)
説明
コード
関連書籍
コメント投稿
このサンプルは、jQueryのjdMenu()プラグインを利用してドロップダウン型のメニューを表示します。ここでは、垂直型のドロップダウンメニューを表示します。
このサンプルを編集して試してみる
←サンプルが背後に隠れて見えないときは左をクリック ！
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>jQuery - DropDown Menu - Vertical (jdMenu)</title> <link href="jQuery/jdMenu/jquery.jdMenu.css" rel="stylesheet" type="text/css" /> <script src="jQuery/jquery-1.2.6.js" type="text/javascript"></script> <script src="jQuery/jdMenu/jquery.dimensions.js" type="text/javascript"></script> <script src="jQuery/jdMenu/jquery.positionBy.js" type="text/javascript"></script> <script src="jQuery/jdMenu/jquery.bgiframe.js" type="text/javascript"></script> <script src="jQuery/jdMenu/jquery.jdMenu.js" type="text/javascript"></script> </head> <body> <div> <ul class="jd_menu jd_menu_vertical"> <li>Home</li> <li class="accessible"><a href="#" class="accessible">Search Engines »</a> <ul> <li><a href="#">US »</a> <ul> <li><a href="http://www.google.com" target="_blank">Google</a></li> <li><a href="http://www.yahoo.com" target="_blank">Yahoo!</a></li> <li><a href="http://www.msn.com" target="_blank">MSN</a></li> </ul> </li> <li><a href="#">Japan »</a> <ul> <li><a href="http://www.google.co.jp" target="_blank">Google Japan</a></li> <li><a href="http://www.yahoo.co.jp" target="_blank">Yahoo! Japan</a></li> <li><a href="http://www.msn.co.jp" target="_blank">MSN Japan</a></li> </ul> </li> </ul> </li> <li><a href="#" class="accessible">Google Products »</a> <ul> <li>Search » <ul> <li><a href="http://base.google.com" target="_blank">Base</a></li> <li><a href="http://code.google.com" target="_blank">Code</a></li> <li><a href="http://images.google.com" target="_blank">Images</a></li> </ul> </li> <li><a href="http://www.gmail.com" target="_blank">GMail</a></li> </ul> </li> <li><a href="http://jsajax.com">Site Map</a></li> </ul> </div> </body> </html>
コメント・提案の投稿！
名前
メール
件名
本文
送信中です...
このサンプルは、jQueryのjdMenu()プラグインを利用してドロップダウン型のメニューを表示します。ここでは、垂直型のドロップダウンメニューを表示します。
このサンプルを編集して試してみる!
Access
|
ASP.NET + Ajax
|
ASP.NET 3.5 + Ajax
|
JavaScript + jQuery