2.8w+
社区成员
- 全部
这个菜单 怎么用 高分100
下面这个菜单我觉得不错 但怎么应用啊 怎么横向显示 ？ 再有如果用的话 是不是直接加到<table>里就可以了？
如果2级里的内容需要从数据库里读出来那怎么改啊？ 谢谢大家了 着急啊！
<script type="text/javascript">
startList.tag = 0;
function startList(rootObj)
{
var navRoot, i=0;
if(rootObj == '' || rootObj == null) rootObj=document.all.navitree;
try
{
navRoot = rootObj;
if(navRoot==null)
{
alert('null a wrong accoured');
}
else
{
for (i=0; i<navRoot.childNodes.length; i++)
{
node = navRoot.childNodes[i];
if (node.nodeName=="LI")
{
node.onmouseover=function()
{
this.className ="over";
}
node.onmouseout=function()
{
this.className="out";
}
if(startList.tag==1)
{
node.className = "out";
}
startList(node);
}
else if (node.nodeName=="UL")
{
startList.tag = 1;
startList(node);
}
} //for end
}
} //try end
catch(e)
{
alert(e);
} //catch end
} //startList
window.onload = startList;
</script>
<style type="text/css">
body { font-size: 12px; font-family: 'Courier New';}.navitree
a { display: block; width: 100%; padding: 5px; margin: 1px; text-decoration: none; background: #ffe; color: #000;}
.navitree a:hover { background: #880; color: #fff;}
.navitree { width: 451px;}
.navitree, .navitree ul {
margin: 0px; padding: 0px;
border-bottom: 1px solid #ccc; border-right: #ccc 1px solid;
list-style-type: none;
}
.navitree li {
position: relative; width: 150px; padding: 0px; border-left: #ccc 1px solid;
border-top: #ccc 1px solid; float: left; background: #fff;
}
.navitree li ul li {
position: relative; width: 150px; padding: 0px; border: #ccc 1px solid; border-bottom: 0px;
border-right: 0px; float: left;
}
.navitree li ul {
display: none; position: absolute; left: -1px; top: 26px;
}
.navitree li ul li ul {
position: absolute; left: 149px; top: -1px;
/* Set 1px less than menu width */
}
li.over ul { display: block; visibility: visible;}
li.out ul { visibility: hidden; /* 比用 display:none 效率会高 */}
</style>
<BODY>
<ul id="navitree" class="navitree">
<li><a href="#">home</a></li>
<li>
<a href="#">about ></a>
<ul id="second">
<li><a href="#">history</a></li>
<li><a href="#">team</a></li>
<li><a href="#">offices</a></li>
</ul>
</li>
<li>
<a href="#">services ></a>
<ul>
<li>
<a href="#">web design ></a>
<ul>
<li><a href="#">web design - sub1</a></li>
<li><a href="#">web design - sub2</a></li>
<li><a href="#">web deisgn - sub3</a></li>
</ul>
</li>
</ul>
</li>
</ul>
</BODY>
如果2级里的内容需要从数据库里读出来那怎么改啊？ 谢谢大家了 着急啊！
<script type="text/javascript">
startList.tag = 0;
function startList(rootObj)
{
var navRoot, i=0;
if(rootObj == '' || rootObj == null) rootObj=document.all.navitree;
try
{
navRoot = rootObj;
if(navRoot==null)
{
alert('null a wrong accoured');
}
else
{
for (i=0; i<navRoot.childNodes.length; i++)
{
node = navRoot.childNodes[i];
if (node.nodeName=="LI")
{
node.onmouseover=function()
{
this.className ="over";
}
node.onmouseout=function()
{
this.className="out";
}
if(startList.tag==1)
{
node.className = "out";
}
startList(node);
}
else if (node.nodeName=="UL")
{
startList.tag = 1;
startList(node);
}
} //for end
}
} //try end
catch(e)
{
alert(e);
} //catch end
} //startList
window.onload = startList;
</script>
<style type="text/css">
body { font-size: 12px; font-family: 'Courier New';}.navitree
a { display: block; width: 100%; padding: 5px; margin: 1px; text-decoration: none; background: #ffe; color: #000;}
.navitree a:hover { background: #880; color: #fff;}
.navitree { width: 451px;}
.navitree, .navitree ul {
margin: 0px; padding: 0px;
border-bottom: 1px solid #ccc; border-right: #ccc 1px solid;
list-style-type: none;
}
.navitree li {
position: relative; width: 150px; padding: 0px; border-left: #ccc 1px solid;
border-top: #ccc 1px solid; float: left; background: #fff;
}
.navitree li ul li {
position: relative; width: 150px; padding: 0px; border: #ccc 1px solid; border-bottom: 0px;
border-right: 0px; float: left;
}
.navitree li ul {
display: none; position: absolute; left: -1px; top: 26px;
}
.navitree li ul li ul {
position: absolute; left: 149px; top: -1px;
/* Set 1px less than menu width */
}
li.over ul { display: block; visibility: visible;}
li.out ul { visibility: hidden; /* 比用 display:none 效率会高 */}
</style>
<BODY>
<ul id="navitree" class="navitree">
<li><a href="#">home</a></li>
<li>
<a href="#">about ></a>
<ul id="second">
<li><a href="#">history</a></li>
<li><a href="#">team</a></li>
<li><a href="#">offices</a></li>
</ul>
</li>
<li>
<a href="#">services ></a>
<ul>
<li>
<a href="#">web design ></a>
<ul>
<li><a href="#">web design - sub1</a></li>
<li><a href="#">web design - sub2</a></li>
<li><a href="#">web deisgn - sub3</a></li>
</ul>
</li>
</ul>
</li>
</ul>
</BODY>
...全文
当前发帖距今超过3年，不再开放新的回复
发表回复
vue-devtools chrome 插件 chrome（谷歌浏览器）vue代码调试插件， 已打包。解压后，通过chrome扩展程序加载即可使用。
使用方法：
1、chrome浏览器输入地址“chrome://extensions/”进入扩展程序页面
2、勾选开发者模式
3、点击“加载已解压的扩展程序...”按钮，选择解压后的chrome文件夹，即可添加成功。
4、添加完vue-devtools扩展程序之后，我们在调试vue应用的时候，ch
rome开发者工具中会看一个vue的一栏，点击之后就可以看见当前页面vue对象的一些信息
OpenGL 课程涵盖了OpenGL开发的方方面面,对开发中经常用到的开发知识点进行讲解,从实战的角度进行编码设计.
第1章-环境建立
第2章-基础图元
第3章-三维世界
第4章-纹理多彩世界
第5章-显存的分配-优化
第6章-场景控制
第7章-光照-真实世界
第8章-模型
第9章-UI制作
第10章-场景编辑器制作
第11章-地形
第12章-脚本引入-lua 教程从最最本的固定管线开始,一节课一个知识点,从实战的角度出发,结合项目开发中经常用到的知识点作深入的讲解,以面向对象的编成方式对知识点进行封装,可以直接引入到项目中使用.通过课程的学习,掌握OpenGL图形编程技巧,并能学以致用.
Hibernate4视频教程_全面来袭 本Java视频教程基于 Hibernate4.x 录制。内容涵盖安装 Hibernatetools 插件、Session 核心方法、持久化对象生命周期、对象关系映射（1-n、1-1、n-n、继承映射）、检索策略、检索方式（对象导航图、OID 检索、HQL、QBC、本地SQL）、Hibernate 一\二级缓存、管理 Session、批量处理等 Hibernate 企业级开发的核心技术。 本Java视频教程将帮助掌握学习者编写出具有合理的软件架构，以及好的运行性能和并发性能的实用 Hibernate 应用。Java视频教程内容注重理论与实践相结合，列举大量具典型性和实用价值的 Hibernate应用实例，并提供详细的开发和部署步骤。
《UML面向对象需求分析与建模教程》 邹盛荣 主编 电子版 2016.01 .doc PPT已在CSDN均可免费下载
《UML面向对象需求分析与建模教程》 邹盛荣 主编 电子版 2016.01 .doc
当当网上可购买纸质书： http://product.dangdang.com/23766413.html
掌握JQuery视频教程 JQuery是一个优秀的JavaScript库。它是轻量级的JS库 ，它兼容CSS3，还兼容各种浏览器（IE 6.0+, FF 1.5+, Safari 2.0+, Opera 9.0+）,是我们编写JavaScript的利器！
适合对象：
需要大量编写JavaScript的朋友
学习条件：
必须掌握HTML、CSS、JavaScript、dom
STM32F407 / F103 PCF8575模块 控制16个I/O口 IIC通信 本例程为STM32F407控制PCF8575模块的16个I/O口输出，本例程基于正点原子STM32F407 IIC例程修改，本例程中使用PCF8575控制16个继电器。
精通C语言指针 指针被誉为C语言的精髓、C本质上是加了一层语法糖的汇编，引进当时先进的函数，保留了汇编强大的地址直接访问功能 —— 指针，使其高效灵活。本课程是黄强老师对于指针的一次专题讲解，相信能给大家带来收获！ a:0:{}
QRegExp的详细解析 引言
正则表达式（regular expression）就是用一个“字符串”来描述一个特征，然后去验证另一个“字符串”是否符合这个特征。比如 表达式“ab+” 描述的特征是“一个 'a' 和 任意个 'b' ”，那么 'ab', 'abb', 'abbbbbbbbbb' 都符合这个特征。 正则表达式可以用来：（1）验证字符串是否符合指定特征，比如验证是否是合法的邮件地址。（2）用来查找字符串，从一个长的文本中查找符合指定特征的字符串，比查找固定字符串更加灵活方便。（3）用来替换，比普通的替换更强大。
OpenGL ES2.0基础 初级学习OpenGL ES2.0的课程，从无到有，从进本的函数讲起，每一课时都附带一个例子程序。深入浅出的讲解可编程管线技术，令人费解的文理，以及混合技术，各种优化技术：顶点缓冲区，索引缓冲区，帧缓冲区，介绍精灵的使用，并使用shader制作粒子特效。 掌握OpenGL ES2.0可编程管线，以及OpenGLES2.0的特性，带领初学者入门。
WPF中用于嵌入其他进程窗口的自定义控件（AppContainer） WPF中用于嵌入其他进程窗口的自定义控件（AppContainer）
具体见博文：http://blog.csdn.net/zzzwwwppp11199988899/article/details/78131292
