点击后慢慢弹出下拉菜单效果代码（栏目管理常用）

<！DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <meta name="keywords" content="站长,网页特效,js特效,广告代码,zzjs,jb51.net,sky,www.jb51.net,站长特效 网" /> <meta name="description" content="www.jb51.net,jb51.net，站长必备js特效及广告代码。大量高质量js特效，提供高质量广告代码下载,尽在jb51.net" /> <title>点击后慢慢弹出下拉菜单，sky整理收集。</title> <script type=text/javascript> function $（d）{ return document.getElementById（d）; } // set or get the current display style of the div function dsp（d,v）{ if（v==undefined）{ return d.style.display; }else{ d.style.display=v; } } // set or get the height of a div. function sh（d,v）{ // if you are getting the height then display must be block to return the absolute height if（v==undefined）{ if（dsp（d）！="none"&& dsp（d）！=""）{ return d.offsetHeight; } viz = d.style.visibility; d.style.visibility = "hidden"; o = dsp（d）; dsp（d,"block"）; r = parseInt（d.offsetHeight）; dsp（d,o）; d.style.visibility = viz; return r; }else{ d.style.height=v; } } /* * Variable "S" defines the speed of the accordian * Variable "T" defines the refresh rate of the accordian */ s=7; t=10; //Collapse Timer is triggered as a setInterval to reduce the height of the div exponentially. function ct（d）{ d = $（d）; if（sh（d）>0）{ v = Math.round（sh（d）/d.s）; v = （v<1） ？ 1 :v ; v = （sh（d）-v）; sh（d,v+"px"）; d.style.opacity = （v/d.maxh）; d.style.filter= "alpha（opacity="+（v*100/d.maxh）+"）;"; }else{ sh（d,0）; dsp（d,"none"）; clearInterval（d.t）; } } //Expand Timer is triggered as a setInterval to increase the height of the div exponentially. function et（d）{ d = $（d）; if（sh（d）<d.maxh）{ v = Math.round（（d.maxh-sh（d））/d.s）; v = （v<1） ？ 1 :v ; v = （sh（d）+v）; sh（d,v+"px"）; d.style.opacity = （v/d.maxh）; d.style.filter= "alpha（opacity="+（v*100/d.maxh）+"）;"; }else{ sh（d,d.maxh）; clearInterval（d.t）; } } // Collapse Initializer function cl（d）{ if（dsp（d）=="block"）{ clearInterval（d.t）; d.t=setInterval（"ct（""+d.id+""）",t）; } } //Expand Initializer function ex（d）{ if（dsp（d）=="none"）{ dsp（d,"block"）; d.style.height="0px"; clearInterval（d.t）; d.t=setInterval（"et（""+d.id+""）",t）; } } // Removes Classname from the given div. function cc（n,v）{ s=n.className.split（/s+/）; for（p=0;p<s.length;p++）{ if（s[p]==v+n.tc）{ s.splice（p,1）; n.className=s.join（" "）; break; } } } //Accordian Initializer function Accordian（d,s,tc）{ // get all the elements that have id as content l=$（d）.getElementsByTagName（"div"）; c=[]; for（i=0;i<l.length;i++）{ h=l[i].id; if（h.substr（h.indexOf（"-"）+1,h.length）=="content"）{c.push（h）;} } sel=null; //then search through headers for（i=0;i<l.length;i++）{ h=l[i].id; if（h.substr（h.indexOf（"-"）+1,h.length）=="header"）{ d=$（h.substr（0,h.indexOf（"-"））+"-content"）; d.style.display="none"; d.style.overflow="hidden"; d.maxh =sh（d）; d.s=（s==undefined）？ 7 : s; h=$（h）; h.tc=tc; h.c=c; // set the onclick function for each header. h.onclick = function（）{ for（i=0;i<this.c.length;i++）{ cn=this.c[i]; n=cn.substr（0,cn.indexOf（"-"））; if（（n+"-header"）==this.id）{ ex（$（n+"-content"））; n=$（n+"-header"）; cc（n,"__"）; n.className=n.className+" "+n.tc; }else{ cl（$（n+"-content"））; cc（$（n+"-header"）,""）; } } } if（h.className.match（/selected+/）！=undefined）{ sel=h;} } } if（sel！=undefined）{sel.onClick（）;} } </script> <style type="text/css"></style> </head> <body onload="new Accordian（"basic-accordian",5,"header_highlight"）;"> ">jb51.net,站长必备的高质量网页特效和广告代码。jb51.net，站长js特效。<hr>网站首页 <ul><li>脚本之家</li> <li>网页特效</li> </ul> 学院概况 <ul><li>广告代码</li> <li>网页特效</li> <li>教学设施</li> <li>刘晓阳校长介绍</li> <li>优良师资</li> <li>资质认证与荣誉</li> </ul>专业设置<ul> <li>形象设计 （大学专科）</li> <li>化妆造型</li> <li>美容</li> <li>美发</li> <li>美甲</li> </ul> 国际文凭课程 <ul><li>cidesco圣迪斯哥</li> <li>city & gulids国际美容师</li> <li>cibtac国际美容师</li> <li>srh国际发型师</li> <li>itec国际专业时装、舞台、媒体化妆师</li> </ul> 师生经典作品<ul> <li>形象设计</li> <li>化妆造型</li> <li>美容</li> <li>美发</li> <li>美甲</li> </ul>在线视频 <ul> <li>学院介绍视频</li> <li>活动视频</li> <li>考试现场视频</li> </ul>蒙妮坦精英学员 <ul> <li>留言本</li> <li>形象设计大学专科毕业生</li> <li>cidesco美容博士人才</li> <li>作育英才时代见证（1981-2000年）</li> </ul>招生信息 <ul> <li>2008年招生简章</li> <li>报名方式</li> <li>报名须知</li> <li>在线报名</li> </ul>咨询留言 <ul> <li>留言本</li> <li>常见问题</li> <li>在线留言</li> <li>联系我们</li> </ul></body> </html>

[Ctrl+A 全选注:如需引入外部Js需刷新才能执行]