当前位置：首页 → 问答吧 → js菜单不行帮帮我吧！我没办法了

js菜单不行帮帮我吧！我没办法了

时间：2010-05-14

来源：互联网

<!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=utf-8" /> <title>无标题文档</title> <style> @charset "utf-8";/* CSS Document */body{margin:0 auto; padding:0; text-align:centere; background:url(images/body_bg.jpg) repeat-x top;padding:0;font-size:12px; line-height:18px; letter-spacing:1px;font-family:Verdana, Arial, Helvetica, sans-serif,"宋体";}form,img,ul,li,dl,dt,dd,ol,h1,h2,h3,h4,h5,h6,div,span,input,select,p{margin:0;padding:0; border:0;}ul,li,dl,dt,dd,ol{list-style-type:none;}a{color:#323232;text-decoration:none;}a:hover{text-decoration:underline;} .category{ position:relative;z-index:9999; height:20px; margin-bottom:10px;background:url(images/select_categroy.jpg) repeat-x; border-left:1px solid #D2D2CA; border-right:1px solid #D2D2CA; padding:2px 0 0 5px; color:#5D6000; width:200PX;} .category span{background:url(images/select_2.jpg) no-repeat right top; cursor:pointer;display:block; height:22px;} .category #select_url{ display:none;position:absolute;left:-1px;top:22px;padding-bottom:5px;padding-left:5px;border:1px solid #D2D2CA; border-top:0; width:161px; background:#F3EFE6;} .category #select_url ul li{color:#000; cursor:pointer; color:#696969; height:20px; line-height:20px;} .category_tree dt{cursor:pointer;position:relative;font-size:12px; font-weight:bold; z-index:8888; height:20px;} #category{width:200px; line-height:21px} .category_tree dt a{color:#97AB00; display:block} .category_tree dd{padding-bottom:10px; overflow:hidden;} .category_tree dd a,.category_tree .sub_category a{ font-weight:normal;color:#555555; padding:0 5px 0 0;} .sub_category{border:1px solid #AAAAAA; background:#FFF;filter:alpha(opacity:70);opacity:0.7; width:125px; padding:10px; padding-top:5px;position:absolute; left:166px; top:-1px; z-index:3; display:none} .sub_category{font-weight:normal; color:#4A4A4A;} .category_tree .sub_category a{display:block;color:#555555; background:url(images/line.jpg) no-repeat left; padding-left:6px} </style> <script> function $(id){return document.getElementById(id);} function initNavMenu(){ var _mNav = $("category").getElementsByTagName('dt'); var a = 0; for(var i=0 ; i < _mNav.length; i++ ){ _mNav[i].onmouseover = function(){ a++; $('sub_category_' + a).style.display = 'block'; } _mNav[i].onmouseout = function(){ $('sub_category_'+a).style.display = 'none'; } } } window.onload = function(){initNavMenu();}</script> </head> <body> <dl id="category"> <dt id="sub0"><a title="动漫角色" target="_blank" href="category-109-b0.html">动漫角色</a> <div class="sub_category" id="sub_category_0"><a title="HelloKitty" target="_blank" href="category-110-b0.html">HelloKitty</a><a title="泰迪熊" target="_blank" href="category-111-b0.html">泰迪熊</a><a title="十二星座" target="_blank" href="category-112-b0.html">十二星座</a><a title="喜洋洋与灰太狼" target="_blank" href="category-116-b0.html">喜洋洋与灰太狼</a><a title="奥特曼" target="_blank" href="category-117-b0.html">奥特曼</a><a title="战龙四驱" target="_blank" href="category-119-b0.html">战龙四驱</a><a title="玩具总动员" target="_blank" href="category-120-b0.html">玩具总动员</a><a title="米老鼠" target="_blank" href="category-121-b0.html">米老鼠</a></div> </dt> <dd> <a title="HelloKitty" target="_blank" href="category-110-b0.html">HelloKitty</a>|<a title="泰迪熊" target="_blank" href="category-111-b0.html">泰迪熊</a>|<a title="十二星座" target="_blank" href="category-112-b0.html">十二星座</a>|<a title="喜洋洋与灰太狼" target="_blank" href="category-116-b0.html">喜洋洋与灰太狼</a>|<a title="奥特曼" target="_blank" href="category-117-b0.html">奥特曼</a>|<a title="战龙四驱" target="_blank" href="category-119-b0.html">战龙四驱</a>|<a title="玩具总动员" target="_blank" href="category-120-b0.html">玩具总动员</a>|<a title="米老鼠" target="_blank" href="category-121-b0.html">米老鼠</a> </dd> <dt id="sub1"><a title="动漫角色" target="_blank" href="category-109-b0.html">动漫角色</a> <div class="sub_category" id="sub_category_1"><a title="HelloKitty" target="_blank" href="category-110-b0.html">HelloKitty</a><a title="泰迪熊" target="_blank" href="category-111-b0.html">泰迪熊</a><a title="十二星座" target="_blank" href="category-112-b0.html">十二星座</a><a title="喜洋洋与灰太狼" target="_blank" href="category-116-b0.html">喜洋洋与灰太狼</a><a title="奥特曼" target="_blank" href="category-117-b0.html">奥特曼</a><a title="战龙四驱" target="_blank" href="category-119-b0.html">战龙四驱</a><a title="玩具总动员" target="_blank" href="category-120-b0.html">玩具总动员</a><a title="米老鼠" target="_blank" href="category-121-b0.html">米老鼠</a></div> </dt> <dd><a title="HelloKitty" target="_blank" href="category-110-b0.html">HelloKitty</a>|<a title="泰迪熊" target="_blank" href="category-111-b0.html">泰迪熊</a>|<a title="十二星座" target="_blank" href="category-112-b0.html">十二星座</a>|<a title="喜洋洋与灰太狼" target="_blank" href="category-116-b0.html">喜洋洋与灰太狼</a>|<a title="奥特曼" target="_blank" href="category-117-b0.html">奥特曼</a>|<a title="战龙四驱" target="_blank" href="category-119-b0.html">战龙四驱</a>|<a title="玩具总动员" target="_blank" href="category-120-b0.html">玩具总动员</a>|<a title="米老鼠" target="_blank" href="category-121-b0.html">米老鼠</a> </dd> <dt id="sub2"><a title="动漫角色" target="_blank" href="category-109-b0.html">动漫角色</a> <div class="sub_category" id="sub_category_2"><a title="HelloKitty" target="_blank" href="category-110-b0.html">HelloKitty</a><a title="泰迪熊" target="_blank" href="category-111-b0.html">泰迪熊</a><a title="十二星座" target="_blank" href="category-112-b0.html">十二星座</a><a title="喜洋洋与灰太狼" target="_blank" href="category-116-b0.html">喜洋洋与灰太狼</a><a title="奥特曼" target="_blank" href="category-117-b0.html">奥特曼</a><a title="战龙四驱" target="_blank" href="category-119-b0.html">战龙四驱</a><a title="玩具总动员" target="_blank" href="category-120-b0.html">玩具总动员</a><a title="米老鼠" target="_blank" href="category-121-b0.html">米老鼠</a></div> </dt> <dd><a title="HelloKitty" target="_blank" href="category-110-b0.html">HelloKitty</a>|<a title="泰迪熊" target="_blank" href="category-111-b0.html">泰迪熊</a>|<a title="十二星座" target="_blank" href="category-112-b0.html">十二星座</a>|<a title="喜洋洋与灰太狼" target="_blank" href="category-116-b0.html">喜洋洋与灰太狼</a>|<a title="奥特曼" target="_blank" href="category-117-b0.html">奥特曼</a>|<a title="战龙四驱" target="_blank" href="category-119-b0.html">战龙四驱</a>|<a title="玩具总动员" target="_blank" href="category-120-b0.html">玩具总动员</a>|<a title="米老鼠" target="_blank" href="category-121-b0.html">米老鼠</a> </dd> </dl> </body> </html>
提示：您可以先修改部分代码再运行

[ 本帖最后由 yuanqiulin 于 2010-5-14 09:20 编辑 ]

作者: yuanqiulin 发布时间: 2010-05-14