saldin
چهارشنبه 14 اردیبهشت 1390, 13:27 عصر
سلام دوستان من یک منو عمودی ساختم که یکی از آیتم هاش دارای زیرمنوست .ولی به محض اینکه موس ازروی لینکی که دارای زیر منوست
("لینک محصولات")جابه جا می شه زیر منو هم hiddenمی شه. یعنی نمیشه وارد زیر منو شد لطفا راهنمایی کنید در ضمن اگر کسی نمونه مشابهی از این
نوع منوهای عمودی داره ممنون میشم بزاره
<!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>Untitled Document</title>
<style>
#nav1 ul {
list-style-type:none;
}
#nav1 ul li {
position:relative;
}
#nav1 ul li a {
text-align:center;
height:32px;
width: 195px;
display:block;
border-right:1px solid #3399CC;
border-bottom:1px groove #FF99CC;
text-decoration:none;
background-color:#CCFF00;
}
#nav1 ul li ul
{
display:none;
right:215px;
top:5px;
}
#nav1 ul li:hover ul {
display: block;
position: absolute;
right:215px;
top:5px;
}
#nav1 ul li:hover ul li a {
display:block;
background-color:#3399CC;
width: 195px;
height:32px;
text-align: center;
}
#nav1 ul li:hover ul li a:hover {
background:#6dc7ec;
color:#fff;
}
</style>
</head>
<body>
<table width="200" align="center" cellspacing="1">
<tr>
<td><div id="nav1">
<ul>
<li><a href="#">صفحه اصلی</a></li>
<li><a href="#">محصولات</a>
<ul>
<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></li>
</ul>
</div></td>
</tr>
</table>
</body>
</html>
("لینک محصولات")جابه جا می شه زیر منو هم hiddenمی شه. یعنی نمیشه وارد زیر منو شد لطفا راهنمایی کنید در ضمن اگر کسی نمونه مشابهی از این
نوع منوهای عمودی داره ممنون میشم بزاره
<!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>Untitled Document</title>
<style>
#nav1 ul {
list-style-type:none;
}
#nav1 ul li {
position:relative;
}
#nav1 ul li a {
text-align:center;
height:32px;
width: 195px;
display:block;
border-right:1px solid #3399CC;
border-bottom:1px groove #FF99CC;
text-decoration:none;
background-color:#CCFF00;
}
#nav1 ul li ul
{
display:none;
right:215px;
top:5px;
}
#nav1 ul li:hover ul {
display: block;
position: absolute;
right:215px;
top:5px;
}
#nav1 ul li:hover ul li a {
display:block;
background-color:#3399CC;
width: 195px;
height:32px;
text-align: center;
}
#nav1 ul li:hover ul li a:hover {
background:#6dc7ec;
color:#fff;
}
</style>
</head>
<body>
<table width="200" align="center" cellspacing="1">
<tr>
<td><div id="nav1">
<ul>
<li><a href="#">صفحه اصلی</a></li>
<li><a href="#">محصولات</a>
<ul>
<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></li>
</ul>
</div></td>
</tr>
</table>
</body>
</html>