<html>
<head>
<title>三级菜单</title>
<meta http-equiv="content-Type" content="text/html;charset=gb2312">
<style type="text/css">
<!--
body {
margin-left: 0px;
margin-top: 30px;
margin-right: 0px;
margin-bottom: 0px;
background-color: #053553;
}
#menu {
background-color: #FEF0E5;
filter:progid:DXImageTransform.Microsoft.Gradient(startColorStr='#ffffff', endColorStr='#FEF0E5', gradientType='0');
}
#nav, #nav ul {
float:left;
clear:right;
list-style:none;
padding:0px;
margin:0px;
}
#nav ul ul{
border-top:0px;
border-right:0px;
}
#nav a {
width:120px;
display:block;
color:#333;
text-decoration:none;
text-align:left;
padding: 3px 4px 3px 7px;
}
#nav a:hover{
color:#000;
margin: 0px;
padding: 2px 5px 2px 6px;
background-color: #f1f1f1;
text-decoration: none;
}
#nav a.selected{background:url() no-repeat right 50%;}
#nav li {
float:none;
clear:right;
height:22px;
width:120px;
}
#nav li ul li{
float:none;
clear:right;
height:22px;
width:120px;
}
#nav li ul {
position:absolute;
margin:-21px 0px 0px 119px;
padding:0;
left:-9999em;
width:120px;
font-weight:normal;
display:block;
border:1px solid #CCCCCC;
background:#fff;
}
#nav li ul a {
width:120px;
text-align:left;
margin: 0px;
}
#nav li ul ul {
margin:-21px 0px 0px 119px;
border:1px solid #CCC;
}
#nav li:hover ul ul,#nav li.sfhover ul ul{left:-9999em;}
#nav li:hover ul,#nav li li:hover ul,#nav li.sfhover ul, #nav li li.sfhover ul{
left:auto;
height:22px;
}
#nav li:hover, #nav li.sfhover {
background:#f1f1f1;
border:1px solid #CCC;
height:22px;
}
/* 悬浮样式 */
-->
</style>
<script type="text/javascript">
img1=new Image();
img1.src="";
sfHover = function() {
var sfEls = document.getElementById("nav").getElementsByTagName("LI");
for (var i=0; i<sfEls.length; i++) {
sfEls[i].onmouseover=function() {
this.className+=" sfhover";
}
sfEls[i].onmouseout=function() {
this.className=this.className.replace(new RegExp(" sfhover\\b"), "");
}
}
}
window.onload=sfHover;
</script>
</head>
<body>
<table width="120" border="0" align="center" cellpadding="0" cellspacing="0" >
<tr>
<td valign="top" id="menu">
<ul id="nav">
<li><a href="#" target="_blank">网站首页</a></li>
<li><a href="#" target="_blank" class="selected">源码下载</a>
<ul>
<li><a href="#" class="selected">ASP源码</a>
<ul>
<li><a href="/sort/list_1_11_1.shtml">聊天留言</a></li><li><a href="/sort/list_1_12_1.shtml">企业建站</a></li><li><a href="/sort/list_1_13_1.shtml">论坛社区</a></li><li><a href="/sort/list_1_14_1.shtml">新闻文章</a></li>
</ul>
</li>
<li ><a href="#" class="selected">PHP源码</a>
<ul>
<li><a href="/sort/list_1_145_1.shtml">博客日记</a></li><li><a href="/sort/list_1_29_1.shtml">CMS系统</a></li><li><a href="/sort/list_1_20_1.shtml">学校政府</a></li><li><a href="/sort/list_1_28_1.shtml">影音视频</a></li>
</ul>
</li>
<li ><a href="#" class="selected">JAVA源码</a>
<ul>
<li><a href="/sort/list_1_87_1.shtml">Ajax相关</a></li><li><a href="/sort/list_1_33_1.shtml">综合其它</a></li>
</ul>
</li>
<li><a href="#">其它下载</a></li>
</ul>
</li>
<li><a href="#" target="_blank" class="selected">最新服务</a>
<ul>
<li><a href="#" class="selected">最新更新</a></li>
<ul>
<li><a href="/sort/list_1_25_1.shtml">办公管理</a></li><li><a href="/sort/list_1_31_1.shtml">小偷采集</a></li><li><a href="/sort/list_1_26_1.shtml">整站程序</a></li><li><a href="/sort/list_1_16_1.shtml">统计调查</a></li><li><a href="/sort/list_1_197_1.shtml">广告网赚</a></li><li>
</ul>
<li><a href="/other/top100.shtml">下载排行</a></li>
<li><a href="/service/ad.shtml">广告服务</a></li>
</ul>
</li>
<li><a href="/">菜单示例</a></li>
</ul>
</td>
</tr>
</table>
</body>
</html>
<head>
<title>三级菜单</title>
<meta http-equiv="content-Type" content="text/html;charset=gb2312">
<style type="text/css">
<!--
body {
margin-left: 0px;
margin-top: 30px;
margin-right: 0px;
margin-bottom: 0px;
background-color: #053553;
}
#menu {
background-color: #FEF0E5;
filter:progid:DXImageTransform.Microsoft.Gradient(startColorStr='#ffffff', endColorStr='#FEF0E5', gradientType='0');
}
#nav, #nav ul {
float:left;
clear:right;
list-style:none;
padding:0px;
margin:0px;
}
#nav ul ul{
border-top:0px;
border-right:0px;
}
#nav a {
width:120px;
display:block;
color:#333;
text-decoration:none;
text-align:left;
padding: 3px 4px 3px 7px;
}
#nav a:hover{
color:#000;
margin: 0px;
padding: 2px 5px 2px 6px;
background-color: #f1f1f1;
text-decoration: none;
}
#nav a.selected{background:url() no-repeat right 50%;}
#nav li {
float:none;
clear:right;
height:22px;
width:120px;
}
#nav li ul li{
float:none;
clear:right;
height:22px;
width:120px;
}
#nav li ul {
position:absolute;
margin:-21px 0px 0px 119px;
padding:0;
left:-9999em;
width:120px;
font-weight:normal;
display:block;
border:1px solid #CCCCCC;
background:#fff;
}
#nav li ul a {
width:120px;
text-align:left;
margin: 0px;
}
#nav li ul ul {
margin:-21px 0px 0px 119px;
border:1px solid #CCC;
}
#nav li:hover ul ul,#nav li.sfhover ul ul{left:-9999em;}
#nav li:hover ul,#nav li li:hover ul,#nav li.sfhover ul, #nav li li.sfhover ul{
left:auto;
height:22px;
}
#nav li:hover, #nav li.sfhover {
background:#f1f1f1;
border:1px solid #CCC;
height:22px;
}
/* 悬浮样式 */
-->
</style>
<script type="text/javascript">
img1=new Image();
img1.src="";
sfHover = function() {
var sfEls = document.getElementById("nav").getElementsByTagName("LI");
for (var i=0; i<sfEls.length; i++) {
sfEls[i].onmouseover=function() {
this.className+=" sfhover";
}
sfEls[i].onmouseout=function() {
this.className=this.className.replace(new RegExp(" sfhover\\b"), "");
}
}
}
window.onload=sfHover;
</script>
</head>
<body>
<table width="120" border="0" align="center" cellpadding="0" cellspacing="0" >
<tr>
<td valign="top" id="menu">
<ul id="nav">
<li><a href="#" target="_blank">网站首页</a></li>
<li><a href="#" target="_blank" class="selected">源码下载</a>
<ul>
<li><a href="#" class="selected">ASP源码</a>
<ul>
<li><a href="/sort/list_1_11_1.shtml">聊天留言</a></li><li><a href="/sort/list_1_12_1.shtml">企业建站</a></li><li><a href="/sort/list_1_13_1.shtml">论坛社区</a></li><li><a href="/sort/list_1_14_1.shtml">新闻文章</a></li>
</ul>
</li>
<li ><a href="#" class="selected">PHP源码</a>
<ul>
<li><a href="/sort/list_1_145_1.shtml">博客日记</a></li><li><a href="/sort/list_1_29_1.shtml">CMS系统</a></li><li><a href="/sort/list_1_20_1.shtml">学校政府</a></li><li><a href="/sort/list_1_28_1.shtml">影音视频</a></li>
</ul>
</li>
<li ><a href="#" class="selected">JAVA源码</a>
<ul>
<li><a href="/sort/list_1_87_1.shtml">Ajax相关</a></li><li><a href="/sort/list_1_33_1.shtml">综合其它</a></li>
</ul>
</li>
<li><a href="#">其它下载</a></li>
</ul>
</li>
<li><a href="#" target="_blank" class="selected">最新服务</a>
<ul>
<li><a href="#" class="selected">最新更新</a></li>
<ul>
<li><a href="/sort/list_1_25_1.shtml">办公管理</a></li><li><a href="/sort/list_1_31_1.shtml">小偷采集</a></li><li><a href="/sort/list_1_26_1.shtml">整站程序</a></li><li><a href="/sort/list_1_16_1.shtml">统计调查</a></li><li><a href="/sort/list_1_197_1.shtml">广告网赚</a></li><li>
</ul>
<li><a href="/other/top100.shtml">下载排行</a></li>
<li><a href="/service/ad.shtml">广告服务</a></li>
</ul>
</li>
<li><a href="/">菜单示例</a></li>
</ul>
</td>
</tr>
</table>
</body>
</html>
- menu.rar (1.5 KB)
- 下载次数: 17
分享到：
发表评论
-
JSON.parse() 与 eval()
2012-01-12 11:31 15996JSON(JavaScript Object Notation ... -
jsp端自动下载并保存图片文件
2011-04-21 23:38 1521JScript code <script languag ... -
iFrame只要竖滚动条，不要横滚动条
2011-04-15 23:22 2347如题，就是在网页中，只显示右侧的垂直滚动条，而不要底部的水平滚 ... -
点击按钮保存网页中指定的图片，利用js实现
2011-04-15 00:50 4254有时候在网页上需要禁用右键菜单，但是需要点击某一按钮保存指定的 ... -
js正则验证
2011-03-31 22:47 718引用网址 http://hi.baidu.com/qui ... -
JavaScript相关文章推荐
2011-03-18 00:27 2773判断js数组包是否包含某个元素 要判断数组中是否包含某个元素 ... -
js 数组array的方法介绍
2011-03-18 00:23 796最近用到了Array就对其 ... -
ie的自动完成功能
2011-03-08 00:10 875<!DOCTYPE HTML PUBLIC " ... -
百度代码搜索，谷歌搜索
2011-03-07 23:55 893<!DOCTYPE HTML PUBLIC " ... -
Javascript的调试利器Firebug使用详解
2011-02-25 23:46 797Javascript的调试利器Firebug使用详解.doc -
IE和Firefox浏览器下javascript、CSS兼容性研究
2011-02-25 21:53 841IE和Firefox浏览器下javascript、CSS兼容性 ... -
JS验证日期时间是否合法
2011-02-17 21:00 1912/^(19|20)\d{2}-(0?\d|1[012])-(0 ... -
正则表达式的JS验证
2011-02-17 20:38 752/判断输入内容是否为空 function IsNull ... -
JS函数 验证日期合法(测试通过)
2011-02-17 20:07 1105<script type="text/java ... -
CSS 制作的三级菜单
2011-02-10 13:11 1012<html> <head> <m ... -
竖向显示，向右弹出的3级层导航菜单特效
2011-02-10 13:08 1413<!DOCTYPE html PUBLIC " ...
相关推荐
NFine 快速开发框架 实现 三级滑动菜单，替换原CSS及JS文件即可
2.jQuery+CSS漂亮蓝色三级菜单下载 3.jquery+css实现简洁两级横向导航菜单,带动态效果 4.jQuery+CSS实现竖形动感导航菜单效果 5.jquery+div漂亮SmartMenu下拉菜单气泡透明效果 6.jQuery+div实现flash炫彩...
NFine 快速开发框架 实现 三级滑动菜单，替换原CSS及JS文件即可
NFine 快速开发框架 实现 三级滑动菜单，替换原CSS及JS文件即可
11.17 三级联动菜单 11.18 树型目录菜单 第12章 窗口特效与弹出式警告 12.1 无关闭按钮的窗口 12.2 鼠标控制窗口开关 12.3 使窗口只第一次访问时弹出 12.4 禁止弹出警告框 12.5 关闭窗口不提示的方法 12.6 关闭窗口...
11.17 三级联动菜单 11.18 树型目录菜单 第12章 窗口特效与弹出式警告 12.1 无关闭按钮的窗口 12.2 鼠标控制窗口开关 12.3 使窗口只第一次访问时弹出 12.4 禁止弹出警告框 12.5 关闭窗口不提示的方法 12.6 关闭窗口...
内容索引:脚本资源,CSS特效,TAB,选项卡 可再次分类的JS+CSS TAB选项卡，由选项卡和滑动门组成，选项卡作为一个一级分类，当点击选项卡后左侧滑动门的内容会相应改变，鼠标这时放到滑动门的任一菜单上，则会展现出...
javascript完全自学手册 目 录 第1篇 JavaScript基础篇 第1章 JavaScript简介 1 1.1 JavaScript概述 1 1.1.1 什么是JavaScript 1 1.1.2 JavaScript的基本特点 2 1.1.3 常用的Web开发语言 3 1.2 JavaScript的应用 4 ...
目录 第1篇 JavaScript基础篇 第1章 JavaScript简介 1．1 JavaScript概述 1．1．1 什么是JavaScript 1．1．2 JavaScfipt的基本特点 1．1．3 常用的Web开发语言 ...14．6．3 滑动菜单 14．6．4 右键菜单 ……
Ajax/JavaScript,Tab,选项卡,滑动门 一个可以支持在同一页面上嵌套显示多个选项卡的一个实例，最多可以嵌套三级，选项卡内部还可以显示选项卡，虽说很多情况下我们不这么用，但是却对了解CSS及JavaScript编程很有...
第一部分 JavaScript入门 1 第1章 编写第一个JavaScript程序 1 1.1 编程简介 1 什么是计算机程序 2 1.2 如何把JavaScript添加到页面 3 外部JavaScript文件 5 1.3 第一个JavaScript程序 7 1.4 把文本写到Web页面上 9 ...
为Android应用开发提供一个轻量级开发框架，让开发者可以基于HTML/CSS/JAVASCRIPT快速开发android应用界面，同时也能够利用mobilelite调用android后台的服务。 18、Android瀑布流实例 android_waterfall 实现了类似...
让一个Webapp拆到多个webview中运行，并能用Javascript来调度。搞定了业务无解的难题：页面过大导致卡顿，页面切换不流畅， Native组件嵌入能力。能将Native控件嵌入Webview中，这样就能让页面中那些性能较差的部分...
7.7 右键菜单插件contextmenu /216 7.8 图片放大镜插件jqzoom /222 7.9 自定义jQuery插件/224 7.9.1 插件的种类/225 7.9.2 插件开发要点/225 7.9.3 开发插件示例/226 7.10 综合案例分析—使用uploadify插件...