jQuery の jdMenuプラグイン を使用して、ドロップダウン型メニューを表示します。
背景等はCSSで指定しています。
jdMenu Hierarchical Menu Plugin for jQuery のページから、プラグイン、CSS、デモ等をZIP形式でダウンロードできます。

対象プラグインを、下記より入手してください。
* jQuery
* jdMenu Hierarchical Menu Plugin for jQuery

サンプル

サンプルソース

JavaScript + CSS

<script type="text/javascript" src="http://www.strollnet.com/js/jquery/jquery-1.3.2.min.js"></script>
<script type="text/javascript" src="http://www.strollnet.com/js/jquery/jquery.dimensions.js"></script>
<script type="text/javascript" src="http://www.strollnet.com/js/jquery/jquery.positionBy.js"></script>
<script type="text/javascript" src="http://www.strollnet.com/js/jquery/jquery.bgiframe.js"></script>
<script type="text/javascript" src="http://www.strollnet.com/js/jquery/jquery.jdMenu.js"></script>
<link rel="stylesheet" type="text/css" href="http://www.strollnet.com/js/jquery/css/jdMenu.css"></script>

HTML

<ul class="jd_menu">
   <li>Sample 1</li>
   <li class="accessible">Sample 2 »
      <ul>
         <li><a href="#">Sample</a></li>
         <li class="accessible">Sample »
            <ul>
               <li><a href="#">Sample</a></li>
               <li><a href="#">Sample</a></li>
               <li><a href="#">Sample</a></li>
            </ul>
         </li>
         <li><a href="#">クリック有効 »</a>
            <ul>
               <li><a href="#">Sample</a></li>
               <li><a href="#">Sample</a></li>
               <li><a href="#">Sample</a></li>
            </ul>
         </li>
      </ul>
   </li>
   <li class="accessible">--- Sample 3 --- »</a>
      <ul>
         <li class="accessible">Sample »
            <ul>
               <li><a href="#">Sample</a></li>
               <li><a href="#">Sample</a></li>
            </ul>
            </li>
         <li><a href="#">Sample</a></li>
      </ul>
   </li>
   <li><a href="#" class="accessible">Sample 4</a></li>
</ul>