梦幻式下拉菜单

所属分类：网络编程 / CSS/HTML 阅读数： 539

收藏 0赞 0分享

<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><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></head></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></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></P>

[Ctrl+A 全选注:引入外部Js需再刷新一下页面才能执行]

更多精彩内容其他人还在看

梦幻式下拉菜单

滚动条效果

层自动适应高度

让2个DIV居中并排显示

会移动的文字(Marquee)

认识CSS中absolute与relative

用CSS构建iframe效果

不用float实现模块居中布局

引入CSS样式的五种方式

利用相对定位及偏移量做精美输入界面

用CSS实现文字变图象特效

网络赚钱

站长故事