수다닷컴

안녕하세요 ^^

궁금한게 있는데요..

CSS 만으로 드롭다운 메뉴를 만들었는데요..

혹시 여기에 자바스크립트 적용해서..

드롭다운 메뉴가 스무스하게 내겨오게 할 수 있을까요??

소스 올려 놓아요~

보시고 좀 알려 주세요~~^0^;

----------------------------------------------------------------------------------------------------

.nav-box {
position:absolute;
width:597px;
right:21px;
top:95px;
}
.nav-box .left {
background:url(images/nav-left.png) no-repeat left top;
}
.nav-box .right {
padding:0 20px 0 22px;
background:url(images/nav-right.png) no-repeat right top;
}
.nav-box ul {
height:53px;
background:url(images/nav-tail.png) repeat-x left top;
}
.nav-box ul li {
float:left;
text-transform:uppercase;
padding-top:20px;
line-height:1.08em;
margin-right:6px;
font-family:Times New Roman, Times, serif;
}
.nav-box ul li.nav-last {
float:left;
text-transform:uppercase;
padding-top:20px;
line-height:1.08em;
margin-right:0px;
font-family:Times New Roman, Times, serif;
}
.nav-box ul li a {
color:#542202;
text-decoration:none;
display:block;
}
.nav-box ul li a em {
display:block;
}
.nav-box ul li a b {
display:block;
font-style:normal;
font-weight:normal;
padding:6px 22px 5px 22px;
}
.nav-box ul li a:hover {
text-decoration:underline;
}
.nav-box ul li a.active {
color:#f5821c;
background:url(images/nav-act-tail.gif) repeat-x left top;
}
.nav-box ul li a.active:hover {
text-decoration:none;
}
.nav-box ul li a.active em {
background:url(images/nav-act-left.gif) no-repeat left top;
}
.nav-box ul li a.active b {
background:url(images/nav-act-right.gif) no-repeat right top;
}

.nav-box ul ul {
position:absolute;
width:126px;
height:180px;
background:#f5821c;
margin:0 0 0 -21px;
display:none;
z-index:50;
}

.nav-box ul ul li {
width:100%;
text-align:center;

}

.nav-box li:hover ul {
display:block;
}

----------------------------------------------------------------------------------------------------

div class=nav-box
div class=left
div class=right
ul id=nav
lia href=index.html class=activeembhome/b/em/a/li
lia href=index-1.htmlembcatering/b/em/a/li
lia href=index-2.htmlembmenu/b/em/a
ul
lia href=#Breakfast/a/li
lia href=#Lunch/a/li
lia href=#Desert/a/li
lia href=#Drinks/a/li
lia href=#Healthy Food/a/li
/ul
/li
lia href=index-3.htmlembhealthy corner/b/em/a/li
li class=nav-lasta href=index-4.htmlembcontact us/b/em/a/li
/ul
/div
/div
/div

신청하기