重なり順序の変更


<div style="position:absolute;top:0px;left:0px;width:12em;font-size:15px;background-color:yellow;
z-index:0;" onMouseover="this.style.zIndex=3" onMouseout="this.style.zIndex=0">検索エンジン<br>
<ul>
<li><a href="http://www.google.co.jp/">Google</a>
<li><a href="http://www.yahoo.co.jp/">Yahoo!</a>
<li><a href="http://www.goo.ne.jp/">goo</a>
<li><a href="http://www.infoseek.co.jp/">Infoseek</a>
<li><a href="http://www.excite.co.jp/">excite</a>
<li><a href="http://www.lycos.co.jp/">LYCOS</a>
<li><a href="http://fresheye.co.jp/">フレッシュアイ</a>
</ul>
</div>
<div style="position:absolute;top:15px;left:0px;width:12em;font-size:15px;background-color:lime;
z-index:1;" onMouseover="this.style.zIndex=3" onMouseout="this.style.zIndex=1">オンラインソフト<br>
<ul>
<li><a href="http://www.vector.co.jp/">Vector</a>
<li><a href="http://www.wakusei.ne.jp/software/free/">フリッポ</a>
<li><a href="http://download.desk.ne.jp/">Download ASCII</a>
<li><a href="http://www.nifty.com/download/">ダウンロード@nifty</a>
<li><a href="http://www.forest.impress.co.jp/">窓の杜</a>
<li><a href="http://www.forest.impress.co.jp/ringo/">林檎の杜</a>
</ul>
</div>
<div style="position:absolute;top:30px;left:0px;width:12em;font-size:15px;background-color:aqua;
z-index:2;" onMouseover="this.style.zIndex=3" onMouseout="this.style.zIndex=2">Web作成<br>
<ul>
<li><a href="http://www.macromedia.com/jp/software/dreamweaver/">Dreamweaver 4</a>
<li><a href="http://www.adobe.co.jp/products/golive/main.html">Adobe GoLive 6.0</a>
<li><a href="http://www.panda.co.jp/hpc/">HomePage Creator 5</a>
<li><a href="http://www.microsoft.com/japan/office/frontpage/default.asp">FrontPage 2002</a>
<li><a href="http://wp.netscape.com/communicator/composer/v4.0/">Netscape Composer</a>
</ul>
</div>
IE、NN共に対応してますので、かなり有効な方法です。各項目にマウスを乗せるとそのメニューが一番上に表示されます。
表示