当前位置: 首页 > 图文教程 > 网络编程 > ASP > javascript css 三级目录(简单的)

ASP
用ASP实现对Web搜索引擎Index Server的访问
ASP.NET数据库应用指南
利用ASP存取各种常用类型数据库(1)
利用ASP存取各种常用类型数据库(2)
利用ASP存取各种常用类型数据库(3)
利用ASP存取各种常用类型数据库(4)
利用ASP存取各种常用类型数据库(5)
利用ASP存取各种常用类型数据库(6)
一个简单的网上书城的例子(一)
一个简单的网上书城的例子(二)
一个简单的网上书城的例子(三)
一个简单的网上书城的例子(四)
一个简单的网上书城的例子(五)
一个简单的网上书城的例子(六)
一个简单的网上书城的例子(七)
一个简单的网上书城的例子(八)
用asp怎样编写文档搜索页面(1)
用asp怎样编写文档搜索页面(2)
用asp怎样编写文档搜索页面(3)
用asp怎样编写文档搜索页面(4)

ASP 中的 javascript css 三级目录(简单的)


出处:互联网   整理: 软晨网(RuanChen.com)   发布: 2009-09-13   浏览: 97 ::
收藏到网摘: n/a

是在原先的二级目录改的,先给出演示
这里是css
复制代码 代码如下:

/*bg macji(http://www.macji.com)*/
ul,li,p{margin:0; padding:0; list-style:none; font-size:12px}
.m_menu_title{height:24px;line-height:24px;text-align:center;margin:0 1px}
.m_menu_content{border-top:solid 1px #ccc;padding:8px 2px}
/*一级*/
.m_menu_content p{height:22px;line-height:22px}
.m_menu_content p a{
color:#666633;
font-weight:bold;
text-decoration:none;
background:url(http://www.macji.com/blog/img/icon.gif) no-repeat 8px 4px;
padding:0 0 0 30px;
display:block
}
.m_menu_content p a:hover{color:#fe8005;font-weight:bold;text-decoration:none}
.m_menu_content p a.on{background-position:8px -18px}
/*二级*/
.menu2{}
.menu2 li{line-height:22px}
.menu2 a{color:#000;
text-decoration:none;
display:block;
padding:0 0 0 40px;
background:url(http://www.macji.com/blog/img/icon.gif) no-repeat 18px 4px
}
.menu2 a.on{background-position:18px -18px}
/*三级*/
.menu2 ul{}
.menu2 ul a{
background-position:30px -39px;
padding:0 0 0 50px;
color:#666633;
text-decoration:underline
}
.menu2 ul a:hover{background-color:#f5f5f5; color:#f60}

目录是循环的,我给写死了.下面给出js
复制代码 代码如下:

/*
这里是直接写死了,根据传入的id编号,判断是否显示,不显示就显示
id编号是有规律的,可用服务器端语言循环出目录
*/
function setMenuList(num){
var p = document.getElementById('p' + num);
var ul = document.getElementById('ul' + num);
if(ul.style.display == ‘none'){
ul.style.display = ”;
p.className = “on”;
}else{
ul.style.display = ‘none';
p.className = “”;
}
}

演示查看
点击运行可以看到效果:

登陆 还没注册?