js实现的折叠导航示例


Posted in Javascript onNovember 29, 2013
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 
<html> 
<head> 
<meta http-equiv=content-type content="text/html; charset=utf-8" /> 
<link href="css/admin.css" type="text/css" rel="stylesheet" /> 
<script language=javascript> 
function expand(el)//传递的是id,1,2,3用来区分所属的分类 
{ 
childobj = document.getElementById("child" + el);//child1,child2..... 
if (childobj.style.display == 'none')//如果此元素师none,就不会被显示 
{ 
childobj.style.display = 'block';//如果是block。就会显示为块级元素 
} 
else 
{ 
childobj.style.display = 'none';//当再次点击时,那么就会又隐藏起来 
} 
return; 
} 
</script> 
</head> 
<body> 
<table height="100%" cellspacing=0 cellpadding=0 width=170 
background=./img/menu_bg.jpg border=0> 
<tr> 
<td valign=top align=middle> 
<table cellspacing=0 cellpadding=0 width="100%" border=0> 
<tr> 
<td height=10></td> 
</tr> 
</table> 
<table cellspacing=0 cellpadding=0 width=150 border=0> 
<tr height=22> 
<td style="padding-left: 30px" background=./img/menu_bt.jpg> 
<a class=menuparent onclick=expand(1) href="javascript:void(0);">人员管理</a></td></tr> 
<tr height=4> 
<td></td></tr></table> 
<table id=child1 style="display: none" cellspacing=0 cellpadding=0 
width=150 border=0> 
<tr height=20> 
<td align=middle width=30><img height=9 
src="./img/menu_icon.gif" width=9></td> 
<td><a class=menuchild 
href="memberadd.jsp" 
target=right>人员增加</a></td></tr> 
<tr height=20> 
<td align=middle width=30><img height=9 
src="./img/menu_icon.gif" width=9></td> 
<td><a class=menuchild 
href="#" 
target=right>人员修改</a></td></tr> 
<tr height=20> 
<td align=middle width=30><img height=9 
src="./img/menu_icon.gif" width=9></td> 
<td><a class=menuchild 
href="#" 
target=right>人员删除</a></td></tr> 
<tr height=20> 
<td align=middle width=30><img height=9 
src="./img/menu_icon.gif" width=9></td> 
<td><a class=menuchild 
href="#" 
target=right>人员查找</a></td></tr> 
<tr height=4> 
<td colspan=2></td> 
</tr> 
</table> 
</body> 
</html>
Javascript 相关文章推荐
javascript中的变量是传值还是传址的?
Apr 19 Javascript
js中将字符串转换成json的三种方式
Jan 12 Javascript
开发 Internet Explorer 右键功能表(ContextMenu)
Jul 03 Javascript
JavaScript中检测变量是否存在遇到的一些问题
Nov 11 Javascript
dreamweaver 8实现Jquery自动提示
Dec 04 Javascript
JavaScript中的console.time()函数详细介绍
Dec 29 Javascript
jQuery中position()方法用法实例
Jan 16 Javascript
Bootstrap插件全集
Jul 18 Javascript
AngularJS入门教程之过滤器详解
Aug 19 Javascript
Easyui Datagrid自定义按钮列(最后面的操作列)
Jul 13 Javascript
简单学习5种处理Vue.js异常的方法
Jun 17 Javascript
JavaScript中的函数式编程详解
Aug 22 Javascript
javascript特殊用法示例介绍
Nov 29 #Javascript
jquery和ajax的关系详细介绍
Nov 29 #Javascript
js操作table示例(个人心得)
Nov 29 #Javascript
css配合jquery美化 select
Nov 29 #Javascript
Jjcarousellite 实现图片列表滚动的简单实例
Nov 29 #Javascript
JS实现多物体缓冲运动实例代码
Nov 29 #Javascript
JS实现匀速运动的代码实例
Nov 29 #Javascript
You might like
收音机的保养
2021/03/01 无线电
PHP实现把数字ID转字母ID
2013/08/12 PHP
Destoon旺旺无法正常显示,点击提示“会员名不存在”的解决办法
2014/06/21 PHP
php中explode函数用法分析
2014/11/15 PHP
我也种棵OO树JXTree[js+css+xml]
2007/04/02 Javascript
自己写了一个展开和收起的多更能型的js效果
2013/03/05 Javascript
浏览器的JavaScript引擎的识别方法
2013/10/20 Javascript
jquery实现图片灯箱明暗的遮罩效果
2013/11/15 Javascript
查找页面中所有类为test的结点的方法
2014/03/28 Javascript
深入分析Cookie的安全性问题
2015/03/01 Javascript
jQuery实现鼠标悬停显示提示信息窗口的方法
2015/04/30 Javascript
jquery ztree实现树的搜索功能
2016/02/25 Javascript
jQuery实现控制文字内容溢出用省略号(…)表示的方法
2016/02/26 Javascript
JS、jQuery中select的用法详解
2016/04/21 Javascript
Bootstrap自定义文件上传下载样式
2016/05/26 Javascript
vue.js学习之递归组件
2016/12/13 Javascript
JavaScript获取短信验证码(周期性)
2016/12/29 Javascript
浅谈Angular.js中使用$watch监听模型变化
2017/01/10 Javascript
小程序视频列表中视频的播放与停止的示例代码
2018/07/20 Javascript
VUE2.0+ElementUI2.0表格el-table实现表头扩展el-tooltip
2018/11/30 Javascript
JavaScript怎样在删除前添加确认弹出框?
2019/05/27 Javascript
vue中解决拖拽改变存在iframe的div大小时卡顿问题
2020/07/22 Javascript
[49:20]2014 DOTA2国际邀请赛中国区预选赛5.21 CIS VS TongFu
2014/05/22 DOTA
Python selenium 三种等待方式解读
2016/09/15 Python
浅析python中SQLAlchemy排序的一个坑
2017/02/24 Python
python利用requests库进行接口测试的方法详解
2018/07/06 Python
Django-Rest-Framework 权限管理源码浅析(小结)
2018/11/12 Python
关于Python作用域自学总结
2019/06/10 Python
详解tensorflow2.x版本无法调用gpu的一种解决方法
2020/05/25 Python
Html5新增标签与样式及让元素水平垂直居中
2019/07/11 HTML / CSS
为奢侈时尚带来了慈善元素:Olivela
2018/09/29 全球购物
Nike比利时官网:Nike.com (BE)
2019/02/07 全球购物
Elizabeth Gage官网:英国最好的珠宝设计之一
2020/09/26 全球购物
如何用SQL语句进行模糊查找
2015/09/25 面试题
《高尔基和他的儿子》教学反思
2014/04/09 职场文书
拒绝盗图!教你怎么用python给图片加水印
2021/06/04 Python