K9 通用版 博客版 主题版 地方门户版 企业版 |   企业(ASP) 分类 使用 分享 疑问 模板 建议 帮助 错误 其他
+新建主题 [Ajax]
填写帐号密码即可完成注册
+新建话题 最新回复排序 最新主题排序 精华帖子

仿蓝色理想鼠标点击显示横向JS+Table导航菜单

1Next >

无聊的飞翔 发表于：11-03-21 21:11 [添加收藏] 楼主 [回复] #Top#
无聊的飞翔 人气：402 积分：1720 金币：20053
KC元老
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>仿经典导航菜单</title>
<style type="text/css">
td { font-size:12px; }
.unsel { background-color:#8c8ba1; background-position:top; background-repeat:repeat-x; color:#FFFFFF; font-weight:normal; }
.sel { background-color:#666688; color:#FFFFFF; font-weight:bold; }
.content { background-color:#666688; height:25px; padding-left:20px; padding-right:20px; color:#ffffff; }
.lineunsel { background-color:#FFFFFF; }
.linesel { background:#666688; }
a:link { color:#ffffff; text-decoration:none; }
a:visited { color:#ffffff; text-decoration:none; }
a:active { color:#ffffff; text-decoration:none; }
a:hover { color:#ffffff; text-decoration:underline; }
</style>
<script language="javascript">
function showdh(n){
for(var i=1;i<=10;i++){
eval("dh"+i).className="unsel"
eval("line"+i).className="lineunsel";
eval("menu"+i).style.display="none";
}
eval("dh"+n).className="sel"
eval("line"+n).className="linesel";
eval("menu"+n).style.display="";
}
</script>
</head>
<body onload="javascript:showdh(1);">
<table width="915" height="30" border="0" align="center" cellpadding="0" cellspacing="0">
  <tr>
    <td width="86" class="unsel" id="dh1"><div align="center"><a href="javascript:showdh(1);">业界动态</a></div></td>
    <td width="6"><div align="center"><img src="<!cmsurl />userfiles/image/20100420/20184011390a378a2c5822.gif" width="6" height="6" /></div></td>
    <td width="86" class="unsel" id="dh2"><div align="center"><a href="javascript:showdh(2);">技术文档</a></div></td>
    <td width="6"><div align="center"><img src="<!cmsurl />userfiles/image/20100420/20184011390a378a2c5822.gif" width="6" height="6" /></div></td>
    <td width="86" class="unsel" id="dh3"><div align="center"><a href="javascript:showdh(3);">艺术设计</a></div></td>
    <td width="6"><div align="center"><img src="<!cmsurl />userfiles/image/20100420/20184011390a378a2c5822.gif" width="6" height="6" /></div></td>
    <td width="86" class="unsel" id="dh4"><div align="center"><a href="javascript:showdh(4);">摄影摄像</a></div></td>
    <td width="6"><div align="center"><img src="<!cmsurl />userfiles/image/20100420/20184011390a378a2c5822.gif" width="6" height="6" /></div></td>
    <td width="86" class="unsel" id="dh5"><div align="center"><a href="javascript:showdh(5);">计算机技术</a></div></td>
    <td width="6"><div align="center"><img src="<!cmsurl />userfiles/image/20100420/20184011390a378a2c5822.gif" width="6" height="6" /></div></td>
    <td width="86" class="unsel" id="dh6"><div align="center"><a href="javascript:showdh(6);">资源下载</a></div></td>
    <td width="6"><div align="center"><img src="<!cmsurl />userfiles/image/20100420/20184011390a378a2c5822.gif" width="6" height="6" /></div></td>
    <td width="86" class="unsel" id="dh7"><div align="center"><a href="javascript:showdh(7);">个人专档</a></div></td>
    <td width="6"><div align="center"><img src="<!cmsurl />userfiles/image/20100420/20184011390a378a2c5822.gif" width="6" height="6" /></div></td>
    <td width="86" class="unsel" id="dh8"><div align="center"><a href="javascript:showdh(8);">CG绘画</a></div></td>
    <td width="6"><div align="center"><img src="<!cmsurl />userfiles/image/20100420/20184011390a378a2c5822.gif" width="6" height="6" /></div></td>
    <td width="86" class="unsel" id="dh9"><div align="center"><a href="javascript:showdh(9);">专题</a></div></td>
    <td width="6"><div align="center"><img src="<!cmsurl />userfiles/image/20100420/20184011390a378a2c5822.gif" width="6" height="6" /></div></td>
    <td width="87" class="sel" id="dh10"><div align="center"><a href="javascript:showdh(10);">经典论坛</a></div></td>
  </tr>
</table>
<table width="915" height="3" border="0" align="center" cellpadding="0" cellspacing="0">
  <tr>
    <td width="86" height="6" id="line1"><img src="<!cmsurl />userfiles/image/20100420/20184011390a378a2c5822.gif" width="86" height="1" /></td>
    <td width="6"><div align="center"><img src="<!cmsurl />userfiles/image/20100420/20184011390a378a2c5822.gif" width="6" height="3" /></div></td>
    <td width="86" id="line2"><img src="<!cmsurl />userfiles/image/20100420/20184011390a378a2c5822.gif" width="86" height="1" /></td>
    <td width="6"><div align="center"><img src="<!cmsurl />userfiles/image/20100420/20184011390a378a2c5822.gif" width="6" height="3" /></div></td>
    <td width="86" id="line3"><img src="<!cmsurl />userfiles/image/20100420/20184011390a378a2c5822.gif" width="86" height="1" /></td>
    <td width="6"><div align="center"><img src="<!cmsurl />userfiles/image/20100420/20184011390a378a2c5822.gif" width="6" height="3" /></div></td>
    <td width="86" id="line4"><img src="<!cmsurl />userfiles/image/20100420/20184011390a378a2c5822.gif" width="86" height="1" /></td>
    <td width="6"><div align="center"><img src="<!cmsurl />userfiles/image/20100420/20184011390a378a2c5822.gif" width="6" height="3" /></div></td>
    <td width="86" id="line5"><img src="<!cmsurl />userfiles/image/20100420/20184011390a378a2c5822.gif" width="86" height="1" /></td>
    <td width="6"><div align="center"><img src="<!cmsurl />userfiles/image/20100420/20184011390a378a2c5822.gif" width="6" height="3" /></div></td>
    <td width="86" id="line6"><img src="<!cmsurl />userfiles/image/20100420/20184011390a378a2c5822.gif" width="86" height="1" /></td>
    <td width="6"><div align="center"><img src="<!cmsurl />userfiles/image/20100420/20184011390a378a2c5822.gif" width="6" height="3" /></div></td>
    <td width="86" id="line7"><img src="<!cmsurl />userfiles/image/20100420/20184011390a378a2c5822.gif" width="86" height="1" /></td>
    <td width="6"><div align="center"><img src="<!cmsurl />userfiles/image/20100420/20184011390a378a2c5822.gif" width="6" height="3" /></div></td>
    <td width="86" id="line8"><img src="<!cmsurl />userfiles/image/20100420/20184011390a378a2c5822.gif" width="86" height="1" /></td>
    <td width="6"><div align="center"><img src="<!cmsurl />userfiles/image/20100420/20184011390a378a2c5822.gif" width="6" height="3" /></div></td>
    <td width="86" id="line9"><img src="<!cmsurl />userfiles/image/20100420/20184011390a378a2c5822.gif" width="86" height="1" /></td>
    <td width="6"><div align="center"><img src="<!cmsurl />userfiles/image/20100420/20184011390a378a2c5822.gif" width="6" height="3" /></div></td>
    <td width="87" id="line10"><img src="<!cmsurl />userfiles/image/20100420/20184011390a378a2c5822.gif" width="86" height="1" /></td>
  </tr>
</table>
<table width="915" border="0" align="center" cellpadding="0" cellspacing="0">
  <tr id="menu1" style="display:none">
    <td  class="content"><a href="#">业界动态一</a>　　<a href="#">业界动态二</a>　　<a href="#">业界动态三</a>　　<a href="#">业界动态四</a>　　<a href="#">业界动态五</a>　　<a href="#">业界动态六</a>　　<a href="javascript:showdh(3);">业界动态七</a></td>
  </tr>
  <tr id="menu2" style="display:none;">
    <td  class="content"><a href="#">技术文档一</a>　　<a href="#">技术文档二</a>　　<a href="#">技术文档三</a>　　<a href="#">技术文档四</a></td>
  </tr>
  <tr id="menu3" style="display:none;">
    <td  class="content"><a href="#">艺术设计一</a>　　<a href="#">艺术设计二</a>　　<a href="#">艺术设计三</a>　　<a href="#">艺术设计四</a>　　<a href="#">艺术设计五</a>　　<a href="#">艺术设计六</a></td>
  </tr>
  <tr id="menu4" style="display:none;">
    <td  class="content"><a href="#">摄影摄像一</a>　　<a href="#">摄影摄像二</a>　　<a href="#">摄影摄像三</a></td>
  </tr>
  <tr id="menu5" style="display:none;">
    <td  class="content"><a href="#">计算机技术一</a>　　<a href="#">计算机技术二</a>　　<a href="#">计算机技术三</a>　　<a href="#">计算机技术四</a>　　<a href="#">计算机技术五</a>　　<a href="#">计算机技术六</a>　　<a href="#">计算机技术七</a>　　<a href="#">计算机技术八</a></td>
  </tr>
  <tr id="menu6" style="display:none;">
    <td  class="content"><a href="#">资源下载一</a>　　<a href="#">资源下载二</a>　　<a href="#">资源下载三</a>　　<a href="#">资源下载四</a></td>
  </tr>
  <tr id="menu7" style="display:none;">
    <td  class="content"><a href="#">个人专档一</a>　　<a href="#">个人专档二</a>　　<a href="#">个人专档三</a>　　<a href="#">个人专档四</a>　　<a href="#">个人专档五</a>　　<a href="#">个人专档六</a>　　<a href="#">个人专档七</a>　　<a href="#">个人专档八</a></td>
  </tr>
  <tr id="menu8" style="display:none;">
    <td  class="content"><a href="#">CG绘画一</a>　　<a href="#">CG绘画二</a>　　<a href="#">CG绘画三</a>　　<a href="#">CG绘画四</a>　　<a href="#">CG绘画五</a></td>
  </tr>
  <tr id="menu9" style="display:none;">
    <td  class="content"><a href="#">专题一</a>　　<a href="#">专题二</a>　　<a href="#">专题三</a>　　<a href="#">专题四</a>　　<a href="#">专题五</a>　　<a href="#">专题六</a>　　<a href="#">专题七</a>　　<a href="#">专题八</a>　　<a href="#">专题九</a>　　<a href="#">专题十</a>　　<a href="#">专题十一</a>　　<a href="#">专题十二</a>　　<a href="#">专题十三</a></td>
  </tr>
  <tr id="menu10" style="display:none;">
    <td  class="content"><a href="#">经典论坛一</a>　　<a href="#">经典论坛二</a>　　<a href="#">经典论坛三</a>　　<a href="#">经典论坛四</a>　　<a href="#">经典论坛五</a>　　<a href="#">经典论坛六</a></td>
  </tr>
</table>
　
<table width="915" border="0" cellspacing="0" cellpadding="0">
  <tr></tr>
</table>
</body>
</html>
乌兰浩特论坛 百衲本：kingcms5.0给力 德阳123
Ta最近还发表过 [疑问] sp2留言修改疑问 (18-03-18) [使用] php的栏目一级列表显示二级内容列表的方法 (17-12-10) [使用] 关于TAG的一些知识 (15-11-23) [分享] 分类你懂的 (14-08-07) [疑问] 请问这两个页面有不一样的功能吗？ (14-07-25)
随机阅读 [错误] feedback留言在 SQLite 内无法使用（已证实） (19-06-13) [模板] 谁有 greasshea 做的清爽后台模板，求分享 (17-09-03) [分享] 接网站项目 (13-11-11) [分享] 【德阳123】2013版上线啦！~~ (13-04-24) [疑问] KC PHP的留言是不是没作完呀 (10-10-14)
toymen 发表于：11-03-22 18:42 沙发 [回复] #Top#
toymen 人气：518 积分：3458 金币：23864
KC元老
鄙视
我是小红帽 发表于：11-03-22 20:56 板凳 [回复] #Top#
我是小红帽 人气：0 积分：11 金币：40
晕，看着眼都花了
nb 发表于：11-03-22 23:54 4楼 [回复] #Top#
nb 人气：19 积分：1000 金币：2345
有点乱哈。

1Next >

发表回复

帐号 匿名发布 审核后可见 [加载完整在线编辑器]
内容
验证码
KingCMS 内容管理系统

关于我们 联系我们 广告报价 付款方式 站点导航

Copyright © 2004-2015 Focuznet All rights reserved.

广州唯众网络科技有限公司 粤ICP备08008106号

中奖了!