[英]Pure css dropdown menu for 2 column
im using pure css dropdown menu for this 即时通讯使用纯css下拉菜单
menu1 menu1option1
menu2 menu1option2
menu1option3
menu1option4
menu1option5
just wondering if using pure css dropdown menu am i able to get this effect? 只是想知道如果使用纯css下拉菜单我能够获得这种效果吗?
menu1 menu1option1 menu1option2
menu2 menu1option3 menu1option4
menu1option5
This is the php code that calls the menu. 这是调用菜单的php代码。
echo '<ul id="navbar">
<!-- The strange spacing herein prevents an IE6 whitespace bug. -->';
$categoryname = "";
while($row = mysql_fetch_array($result))
{
if($categoryname != "" && $categoryname != $row['categoryname']) echo '</ul></li><li><a onmouseover="adjust('.$row['id'].')" href="providerslisting.php?category='.urlencode($row['categoryname']).'">'.$row['categoryname'].'</a><ul id="'.$row['id'].'">';
elseif($categoryname == "" && $categoryname != $row['categoryname']) echo '<li><a onmouseover="adjust('.$row['id'].')" href="providerslisting.php?category='.urlencode($row['categoryname']).'">'.$row['categoryname'].'</a><ul id="'.$row['id'].'">';
echo '<li><a href="providerslisting.php?category='.urlencode($row['categoryname']).'&subcategory='.urlencode($row['name']).'">'.$row['name'].'</a></li>';
$categoryname = $row['categoryname'];
}
echo '</ul></li></ul>';
This is the css code for the menu 这是菜单的css代码
#navbar {
margin: 0;
padding: 0;
}
#navbar li {
list-style: none;
position:relative;
}
#navbar li a {
display: block;
color:#333333;
padding:5px 5px;
}
#navbar li a:hover {
background:#333333;
color: #FFFFFF;
}
#navbar li ul {
display: none;
}
#navbar li:hover ul, #navbar li.hover ul {
display: block;
position: absolute;
left:199px;
top:0px;
margin: 0;
padding: 0;
border-left:1px solid #CCCCCC;
}
#navbar li:hover li, #navbar li.hover li {
float: none;
}
#navbar li:hover li a, #navbar li.hover li a {
background:#EEEEEE;
border:none;
color: #FFFFFF;
padding:5px 15px;
width:720px;
}
#navbar li:hover li a, #navbar li:hover a {
background:#333333;
color: #FFFFFF;
}
#navbar li li a:hover {
color: #999999;
}
Hope that someone is able to point to me in the right direction 希望有人能指出我正确的方向
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.