站长中国
站长社区
站长论坛
技术学院
源码下载
模板下载
问高手
建站资源
站长工具
找链接
找链接
特效首页
Js特效
Css特效
javascript 特效
文字特效
菜单导航特效
背景图像特效
图层特效
鼠标特效
页面窗口特效
色彩表格特效
表单按钮特效
游戏娱乐特效
日期时间特效
综合特效代码
csS特效
横向导航
竖向导航
图片css
表单css
divcss
链接按钮
页面布局
其他特效
下拉菜单
分类:菜单导航特效 来源: 作者: 时间:2009-01-15
使用方法&效果
推荐:
启网
- 专业的主机、服务器合租提供商
17hz.net - 5年服务器合租精品服务
请运行以下代码查看效果
代码
<html> <head> <title>网页特效梦幻下拉菜单</title> </head><body> <!--将以下代码加入HTML的<Body></Body>之间--> <style> <!-- #iewrap{ position:relative; height:30px } #iewrap2{ position:absolute } #dropmenu03{ filter:revealTrans(Duration=1.5,Transition=12) visibility:hide } a:hover { color: #FF0000} body { font-family: "宋体"; font-size: 9pt; text-decoration: none} a { font-family: "宋体"; font-size: 9pt; text-decoration: none} --> </style> <ilayer id="dropmenu01" height=35px> <layer id="dropmenu02" visibility=show> <span id="iewrap"> <span id="iewrap2" onClick="dropit2();event.cancelBubble=true;return false"> <font face="宋体"><a href="#"> 导航菜单 </a></font> </span> </span> </layer> </ilayer> <script language="JavaScript1.2"> var enableeffect=true var selection=new Array() selection[0]='<font face="宋体"><a href="#">网页特效</a></font><br>' selection[1]='<font face="宋体"><a href="#">学习教程</a></font><br>' selection[2]='<font face="宋体"><a href="#">平面设计</a></font><br>' selection[3]='<font face="宋体"><a href="#">资源文章</a></font><br>' selection[4]='<font face="宋体"><a href="#">源码下载</a></font><br>' if (document.layers) document.dropmenu01.document.dropmenu02.visibility='show' function dropit2(){ if (document.all){ dropmenu03.style.left=document.body.scrollLeft+event.clientX-event.offsetX dropmenu03.style.top=document.body.scrollTop+event.clientY-event.offsetY+18 if (dropmenu03.style.visibility=="hidden"){ if (enableeffect) dropmenu03.filters.revealTrans.apply() dropmenu03.style.visibility="visible" if (enableeffect) dropmenu03.filters.revealTrans.play() } else{ hidemenu() } } } function dropit(e){ if (document.dropmenu03.visibility=="hide") document.dropmenu03.visibility="show" else document.dropmenu03.visibility="hide" document.dropmenu03.left=e.pageX-e.layerX document.dropmenu03.top=e.pageY-e.layerY+19 return false } function hidemenu(){ if (enableeffect) dropmenu03.filters.revealTrans.stop() dropmenu03.style.visibility="hidden" } function hidemenu2(){ document.dropmenu03.visibility="hide" } if (document.layers){ document.dropmenu01.document.dropmenu02.captureEvents(Event.CLICK) document.dropmenu01.document.dropmenu02.onclick=dropit } else if (document.all) document.body.onclick=hidemenu </script> <div id="dropmenu03" style="position:absolute;left:0;top:0;layer-background-color:seashell;background-color:seashell;width:120;visibility:hidden;border:1px solid black;padding:0px"> <script language="JavaScript1.2"> if (document.all) dropmenu03.style.padding='4px' for (i=0;i<selection.length;i++) document.write(selection[i]) </script> </div> <script language="JavaScript1.2"> if (document.layers){ document.dropmenu03.captureEvents(Event.CLICK) document.dropmenu03.onclick=hidemenu2 } </script> </tr></table> </body></html>
运行代码
复制代码
© CopyRight 2006-2009,CNZZAD.COM, Inc. All Rights Reserved 1.89MB 0.0393
鲁ICP备05001756号
站长中国群1:
30492658
精致合租咨询群1:
21445564