~下拉菜单有关问题~拜托了
日期：2014-05-17 浏览次数：20704 次
求助~下拉菜单问题~拜托了
各位高手，如何实现浏览过的菜单显示浏览痕迹，浏览二级菜单在一级菜单上也能有所体现？
我写的css，只有一级菜单能实现显示浏览痕迹，而且会一直显示，再点别的，点过的依然显示浏览过的痕迹，只有清除缓存才能恢复原状。
我想实现的功能是点哪个，哪个能看到visited，别的正常，然后点另一个，另一个显示visited，前一个恢复原来的状态，请问各位应该怎么实现好？
代码如下
<!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>
body { background:#999;margin-left: 0px;margin-top: 0px;margin-right: 0px;margin-bottom: 0px;}
*{margin:0;padding:0;}
ul { list-style:none}
#nav {
line-height: 39px; list-style-type: none; background:#CCC;
}
#nav a {
display: block; padding:0 25px; text-align:center; text-decoration:none;font-size:14px; font-weight:bold;color:#ffffff;
}
#nav a:link {
color:#ffffff; text-decoration:none;font-size:14px; font-weight:bold;
}
#nav a:visited {
color:#ffffff;text-decoration:none;font-size:14px; font-weight:bold;
}
#nav a:hover {
color:#131414;text-decoration:none;font-size:14px; font-weight:bold;
}
#nav li a:link {
color:#ffffff; text-decoration:none;font-size:14px; font-weight:bold;
}
#nav li a:visited {
color:#131414;text-decoration:none;font-size:14px; font-weight:bold;background:#ccc;
}
#nav li a:hover {
color:#131414;text-decoration:none;font-size:14px; font-weight:bold; background: #F6F6F6;
}
#nav li {
float: left;
}
#nav li ul {
line-height: 27px; list-style-type: none;text-align:left; overflow:hidden;
left: -999em; width: 130px; position: absolute;
}
#nav li ul li{
float: left; width: 130px;
background: #F6F6F6;
}
#nav li ul a{
display: block; width: 130px;text-align:left; padding-left:26px;
}
#nav li ul li a:link {
color:#666; text-decoration:none; font-size:12px; font-weight:bold;
}
#nav li ul li a:visited {
color:#000;text-decoration:none; font-size:12px; font-weight:bold; background:#CCC;
}
#nav li ul li a:hover {
color:#FFFFFF;text-decoration:none; font-size:12px; font-weight:bold;
background:#f0020d;
}
#nav li:hover ul {
left: auto;
}
#nav li.sfhover ul {
left: auto;
}
#content {
clear: left;
}
</style>
</head>
<body>
<div id="nav">
<ul>
<li><a href="1" >1111</a>
</li>
<li><a href="2">2222</a>
</li>
<li><a href="3" >3333</a>
</li>
<li><a href="4">4444</a>
</li>
<li><a href="5" >55555</a>
<ul>
<li><a href="51" >55551111</a></li>
<li><a href="53">55552222</a></li>
<li><a href="53" >55553333</a></li>
</ul>
</li>
<li><a hre
各位高手，如何实现浏览过的菜单显示浏览痕迹，浏览二级菜单在一级菜单上也能有所体现？
我写的css，只有一级菜单能实现显示浏览痕迹，而且会一直显示，再点别的，点过的依然显示浏览过的痕迹，只有清除缓存才能恢复原状。
我想实现的功能是点哪个，哪个能看到visited，别的正常，然后点另一个，另一个显示visited，前一个恢复原来的状态，请问各位应该怎么实现好？
代码如下
<!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>
body { background:#999;margin-left: 0px;margin-top: 0px;margin-right: 0px;margin-bottom: 0px;}
*{margin:0;padding:0;}
ul { list-style:none}
#nav {
line-height: 39px; list-style-type: none; background:#CCC;
}
#nav a {
display: block; padding:0 25px; text-align:center; text-decoration:none;font-size:14px; font-weight:bold;color:#ffffff;
}
#nav a:link {
color:#ffffff; text-decoration:none;font-size:14px; font-weight:bold;
}
#nav a:visited {
color:#ffffff;text-decoration:none;font-size:14px; font-weight:bold;
}
#nav a:hover {
color:#131414;text-decoration:none;font-size:14px; font-weight:bold;
}
#nav li a:link {
color:#ffffff; text-decoration:none;font-size:14px; font-weight:bold;
}
#nav li a:visited {
color:#131414;text-decoration:none;font-size:14px; font-weight:bold;background:#ccc;
}
#nav li a:hover {
color:#131414;text-decoration:none;font-size:14px; font-weight:bold; background: #F6F6F6;
}
#nav li {
float: left;
}
#nav li ul {
line-height: 27px; list-style-type: none;text-align:left; overflow:hidden;
left: -999em; width: 130px; position: absolute;
}
#nav li ul li{
float: left; width: 130px;
background: #F6F6F6;
}
#nav li ul a{
display: block; width: 130px;text-align:left; padding-left:26px;
}
#nav li ul li a:link {
color:#666; text-decoration:none; font-size:12px; font-weight:bold;
}
#nav li ul li a:visited {
color:#000;text-decoration:none; font-size:12px; font-weight:bold; background:#CCC;
}
#nav li ul li a:hover {
color:#FFFFFF;text-decoration:none; font-size:12px; font-weight:bold;
background:#f0020d;
}
#nav li:hover ul {
left: auto;
}
#nav li.sfhover ul {
left: auto;
}
#content {
clear: left;
}
</style>
</head>
<body>
<div id="nav">
<ul>
<li><a href="1" >1111</a>
</li>
<li><a href="2">2222</a>
</li>
<li><a href="3" >3333</a>
</li>
<li><a href="4">4444</a>
</li>
<li><a href="5" >55555</a>
<ul>
<li><a href="51" >55551111</a></li>
<li><a href="53">55552222</a></li>
<li><a href="53" >55553333</a></li>
</ul>
</li>
<li><a hre
免责声明： 本文仅代表作者个人观点，与爱易网无关。其原创性以及文中陈述文字和内容未经本站证实，对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺，请读者仅作参考，并请自行核实相关内容。
