Fantasy drop-down menu_CSS/HTML

<p><style type="TEXT/CSS"> A { TEXT-DECORATION: none } A:hover { COLOR: #ff9900; TEXT-DECORATION: underline } TD { FONT-SIZE: 9pt; LINE-HEIGHT: 13pt } TH { FONT-SIZE: 9pt; LINE-HEIGHT: 13pt } BODY { FONT-SIZE: 9pt; LINE-HEIGHT: 13pt } #mnu { FILTER: revealTrans(Duration=1.5,Transition=12) visibility:hide } </style></p> <p> </p> <p> </p> <table border="1" width="13%" bordercolorlight="#000000" bordercolordark="#FFFFFF" bordercolor="#EFEFEF" cellspacing="0"> <tr> <td width="100%"> <p align="center"><a href="javascript:set_mnu(mnu);">显示菜单</a> </p> </td> </tr> </table> <div id="mnu" style="HEIGHT: 10px; LEFT: 1px; POSITION: relative; TOP: 1px; VISIBILITY: hidden; WIDTH: 93px; Z-INDEX: 1"> <table border="0" cellpadding="2" cellspacing="4" width="100%"> <tbody> <tr> <td align="center" style="border: 1 solid #000000">测试一</td> </tr> <tr> <td align="center" style="border: 1 solid #000000"><a href="#">测试一</a></td> </tr> <tr> <td align="center" style="border: 1 solid #000000"><a href="#">测试一</a></td> </tr> <tr> <td height="13" align="center" style="border: 1 solid #000000"><a href="javascript:window.location='view-source:'+window.location.href" onclick="window.location='view-source:'+window.location.href">查看源文件</a></td> </tr> </tbody> </table> </div>
[Ctrl+A to select all Note: If you need to introduce external Js, you need to refresh it to execute

]<script> function set_mnu() { if (mnu.style.visibility=="hidden") { //产生效果和把图层显示 mnu.filters.revealTrans.apply(); mnu.style.visibility="visible"; mnu.filters.revealTrans.play(); } else{ //隐藏图层和停止效果播放 mnu.filters.revealTrans.stop(); mnu.style.visibility="hidden" ; } } </script>