navid3d_69
یک شنبه 26 آذر 1391, 13:31 عصر
سلام من می خوام توی این منو وقتی که یکی از زیر منو ها فعال میشه رنگ منوی مادر اون منو هم رنگی بشه ولی نمیشه مثلا در منوی اصلی وقتی روی هر کدوم از زیر منو ها میره رنگ منو اصلی هم سبز بشه و وقتی روی زیر منو های منو جانبی میره رنگ رنگ خود منو جانبی قرمز بشه میشه لطفا اهنمایی کنید
<!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" />
<style type="text/css">
body {
font-family:Tahoma, Geneva, sans-serif;
font-size:12px;
direction:rtl;
}
a {
text-decoration:none;
color:#FFF;
}
a:hover {
color:#CCC;
}
#main-menu {
position:relative;
}
#main-menu a {
display:block;
width:150px;
padding:8px;
border:#666 solid 1px;
background-color:#030;
}
#main-menu a:hover {
background-color:#F00;
}
#main-menu ul {
list-style-type:none;
padding-top:0px;
}
#main-menu li {
float:right;
position:relative;
text-align:center;
}
#main-menu li ul a{
text-align:center;
border:0px;
border-bottom:#666 1px solid;
}
#main-menu ul.sub-menu {
display:none;
position:absolute;
top:30px;
margin-right:0px;
padding:0px;
z-index:999;
}
#main-menu ul.sub-menu li {
text-align:center;
}
#main-menu li:hover ul.sub-menu {
display: block;
border: 1px solid #666;
}
.clear{
clear:both;
}
#program {
background:#F00;
}
#programhover a:hover {
background-color: #7ac142
}
</style>
</head>
<body>
<div id="main-menu">
<ul>
<li id="programhover"><a href="#">منوی اصلی</a>
<ul id="program" class="sub-menu">
<li><a href="#">منوی زیرمجموعه</a></li>
<li><a href="#">منوی زیرمجموعه</a></li>
<li><a href="#">منوی زیرمجموعه</a></li>
<li><a href="#">منوی زیرمجموعه</a></li>
</ul>
</li>
<li><a href="#">منوی جانبی</a>
<ul id="menutwo" class="sub-menu">
<li><a href="#">منوی زیرمجموعه</a></li>
<li><a href="#">منوی زیرمجموعه</a></li>
<li><a href="#">منوی زیرمجموعه</a></li>
<li><a href="#">منوی زیرمجموعه</a></li>
</ul>
</li>
</ul>
<div class="clear"></div>
</div>
<hr />
</body>
</html>
<!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" />
<style type="text/css">
body {
font-family:Tahoma, Geneva, sans-serif;
font-size:12px;
direction:rtl;
}
a {
text-decoration:none;
color:#FFF;
}
a:hover {
color:#CCC;
}
#main-menu {
position:relative;
}
#main-menu a {
display:block;
width:150px;
padding:8px;
border:#666 solid 1px;
background-color:#030;
}
#main-menu a:hover {
background-color:#F00;
}
#main-menu ul {
list-style-type:none;
padding-top:0px;
}
#main-menu li {
float:right;
position:relative;
text-align:center;
}
#main-menu li ul a{
text-align:center;
border:0px;
border-bottom:#666 1px solid;
}
#main-menu ul.sub-menu {
display:none;
position:absolute;
top:30px;
margin-right:0px;
padding:0px;
z-index:999;
}
#main-menu ul.sub-menu li {
text-align:center;
}
#main-menu li:hover ul.sub-menu {
display: block;
border: 1px solid #666;
}
.clear{
clear:both;
}
#program {
background:#F00;
}
#programhover a:hover {
background-color: #7ac142
}
</style>
</head>
<body>
<div id="main-menu">
<ul>
<li id="programhover"><a href="#">منوی اصلی</a>
<ul id="program" class="sub-menu">
<li><a href="#">منوی زیرمجموعه</a></li>
<li><a href="#">منوی زیرمجموعه</a></li>
<li><a href="#">منوی زیرمجموعه</a></li>
<li><a href="#">منوی زیرمجموعه</a></li>
</ul>
</li>
<li><a href="#">منوی جانبی</a>
<ul id="menutwo" class="sub-menu">
<li><a href="#">منوی زیرمجموعه</a></li>
<li><a href="#">منوی زیرمجموعه</a></li>
<li><a href="#">منوی زیرمجموعه</a></li>
<li><a href="#">منوی زیرمجموعه</a></li>
</ul>
</li>
</ul>
<div class="clear"></div>
</div>
<hr />
</body>
</html>