一个简单的收缩菜单效果- Javascript

当前位置: 首页 > 图文教程 > 网络编程 > Javascript > 一个简单的收缩菜单效果

Javascript: 用js实现终止浏览器对页面HTML的继续解析即停止解析兼容firefox; Auntion-TableSort国人写的一个javascript表格排序的东西; javascript实现二分查找法实现代码; 利用ASP发送和接收XML数据的处理方法与代码; 兼容ie和firefox的鼠标经过(onmouseover和onmouseout)实现--简短版; javascript之文本框输入四个数字自动加空格的脚本; 比较简单实用的使用正则三种版本的js去空格处理方法; 比较简洁的JavaScript 实时显示时间的脚本修正版; JavaScript检查表单是否为空的函数; window.open被浏览器拦截后的自定义提示效果代码; javascript跟随鼠标的文字带滚动效果; 让插入到 innerHTML 中的 script 跑起来的代码; Flash+XML滚动新闻代码无图片附源码下载; javascript(js) join函数使用方法介绍; 表格头固定而列可滚动的效果; document.designMode的功能与使用方法介绍; 精解window.setTimeout()&window.setInterval()使用方式与参数传递问题！; 用javascript实现的电信铁通（网通）自动跳转源代码; 用js查找法实现当前栏目的高亮显示的代码; javascript之鼠标拖动位置互换效果代码

No. « ‹ 86 87 88 89 › »

技术文章搜索

关键字

Javascript 中的一个简单的收缩菜单效果

出处:互联网 整理: 软晨网（RuanChen.com） 发布: 2009-10-10 浏览: 391 ::

收藏到网摘: n/a

用javascript实现“闪动”标题栏 HTML-CSS群中单选引发的“事件”

点击运行可以看到效果:

<table width="174"> <tr> <td bgcolor="#99CCFF"><a href="javascript:showmenu(lay0)" >网页设计</a></td> </tr> <tr id='lay0' style="display:none;"> <td><table width="100%" border="0" cellspacing="0"> <tr> <td width="12%"> </td> <td width="88%"><a href="Teach_Dr.asp?owen1=网面设计 owen2=基础知识" target="_blank">基础知识</a></td> </tr> <tr> <td> </td> <td><a href="Teach_Dr.asp?owen1=网面设计 owen2=HTML和CSS" target="_blank">HTML和CSS</a></td> </tr> <tr> <td> </td> <td><a href="Teach_Dr.asp?owen1=网面设计 owen2=Dreamweaver" target="_blank">Dreamweaver</a></td> </tr> <tr> <td> </td> <td><a href="Teach_Dr.asp?owen1=网面设计 owen2=FrontPage" target="_blank">FrontPage</a></td> </tr> <tr> <td> </td> <td><a href="Teach_Dr.asp?owen1=网面设计 owen2=Xhtml" target="_blank">Xhtml</a></td> </tr> </table></td> </tr> <tr> <td bgcolor="#99CCFF"><a href="javascript:showmenu(lay1)" >FLASH</a></td> </tr> <tr id='lay1' style="display:none;"> <td><table width="100%" border="0" cellspacing="0"> <tr> <td width="11%"> </td> <td width="89%"><a href="Teach_Dr.asp?owen1=Flash owen2=基础知识" target="_blank">基础知识</a></td> </tr> <tr> <td> </td> <td><a href="Teach_Dr.asp?owen1=Flash owen2=初级操作">初级操作</a></td> </tr> <tr> <td> </td> <td><a href="Teach_Dr.asp?owen1=Flash owen2=实例教学" target="_blank">实例教学</a></td> </tr> <tr> <td> </td> <td><a href="Teach_Dr.asp?owen1=Flash owen2=Action应用" target="_blank">Action应用</a></td> </tr> </table></td> </tr> <tr> <td bgcolor="#99CCFF"><a href="javascript:showmenu(lay2)" >平面设计</a></td> </tr> <tr id='lay2' style="display:none;"> <td><table width="100%" border="0" cellspacing="0"> <tr> <td width="13%"> </td> <td width="87%"><a href="Teach_Dr.asp?owen1=平面设计 owen2=基础知识" target="_blank">基础知识</a></td> </tr> <tr> <td> </td> <td><a href="Teach_Dr.asp?owen1=平面设计 owen2=Photoshop">Photoshop</a></td> </tr> <tr> <td> </td> <td><a href="http://www.ruanchen.com/" style="color: #000">Fireworks</a>"><a href="http://www.ruanchen.com/" style="color: #000">Fireworks</a></a></td> </tr> <tr> <td> </td> <td><a href="Teach_Dr.asp?owen1=平面设计 owen2=滤镜专辑" target="_blank">滤镜专辑</a></td> </tr> <tr> <td> </td> <td><a href="Teach_Dr.asp?owen1=平面设计 owen2=CorelDraw" target="_blank">CorelDraw</a></td> </tr> </table></td> </tr> <tr> <td bgcolor="#99CCFF"><a href="javascript:showmenu(lay3)" >编程开发</a></td> </tr> <tr id='lay3' style="display:none;"> <td><table width="100%" border="0" cellspacing="0"> <tr> <td width="13%"> </td> <td><a href="Teach_Dr.asp?owen1=编程开发 owen2=Asp" target="_blank">Asp</a></td> </tr> <tr> <td> </td> <td><a href="Teach_Dr.asp?owen1=编程开发 owen2=ASP.NET" target="_blank">ASP.NET</a></td> </tr> <tr> <td> </td> <td><a href="Teach_Dr.asp?owen1=编程开发 owen2=基础知识" target="_blank">JSP</a></td> </tr> <tr> <td> </td> <td><a href="Teach_Dr.asp?owen1=编程开发 owen2=基础知识" target="_blank">PHP</a></td> </tr> <tr> <td> </td> <td><a href="Teach_Dr.asp?owen1=编程开发 owen2=基础知识" target="_blank">数据库</a></td> </tr> </table></td> </tr> <tr> <td bgcolor="#99CCFF"><a href="javascript:showmenu(lay4)" >网页特效</a></td> </tr> <tr id='lay4' style="display:none;"> <td><table width="100%" border="0" cellspacing="0"> <tr> <td width="13%"> </td> <td><a href="Teach_Dr.asp?owen1=网页特效 owen2=窗体特效" target="_blank">窗体特效</a></td> </tr> <tr> <td> </td> <td><a href="Teach_Dr.asp?owen1=网页特效 owen2=菜单特效" target="_blank">菜单特效</a></td> </tr> <tr> <td> </td> <td><a href="Teach_Dr.asp?owen1=网页特效 owen2=文本特效" target="_blank">文本特效</a></td> </tr> <tr> <td> </td> <td><a href="Teach_Dr.asp?owen1=网页特效 owen2=鼠标特效" target="_blank">鼠标特效</a></td> </tr> <tr> <td> </td> <td><a href="Teach_Dr.asp?owen1=网页特效 owen2=图像媒体" target="_blank">图像媒体</a></td> </tr> <tr> <td> </td> <td><a href="Teach_Dr.asp?owen1=网页特效 owen2=时间日期" target="_blank">时间日期</a></td> </tr> <tr> <td> </td> <td><a href="Teach_Dr.asp?owen1=网页特效 owen2=其它综合" target="_blank">其它综合</a></td> </tr> </table></td> </tr>
</table>
<script language=JavaScript>
function showmenu(strID){ var i; for(i=0;i<=4;i++){ var lay; lay = eval('lay' + i); if (lay.style.display=="block" && lay!=eval(strID)){ lay.style.display = "none"; } } if (strID.style.display=="none"){ strID.style.display = "block"; }else{ strID.style.display = "none"; }
}
</script>

[Ctrl+A 全选提示:你可先修改部分代码,再按运行]

用javascript实现“闪动”标题栏 HTML-CSS群中单选引发的“事件”

Javascript 中的 一个简单的收缩菜单效果

评论 (0) All

Javascript 中的一个简单的收缩菜单效果