CSSアコーディオン/ツリーメニュー

Question

私はそうのようなHTMLとCSS/JSのアコーディオンメニューを作成したい：

<ul> 
    <li><a href="#">First Link</a> 
     <ul> 
      <li><a href="#">Child One</a></li> 
      <li><a href="#">Child Two</a></li> 
     </ul> 
    </li> 
    <li><a href="#">Second Link</a></li> 
    <li><a href="#">Third Link</a></li> 
</ul> 

NAV構造はNレベルが深く得ることができ、それぞれの子メニューますその親からインデントされる。 n番目のレベルの子要素を含むすべてのnav要素の間に幅の100％に跨る境界があるようにします。このように：

alt text http://files.getdropbox.com/u/64548/nested-nav.png

私は私の人生のためにJavaScriptを使用せずにこれを行う簡単な方法を把握することはできませんが、それは可能なはず何かのように感じています。 （私はJSを使ってnavツリーを展開/折りたたむ）。