세로펼침메뉴에서 hover시 2depth가 1depth를 가려버리는데요
접시
궁금합니다!
아래의 좌측처럼 마우스오버시 2depth가 밀리면서 보여야 하는데, 우측처럼 그냥 위에 떠버리네요.
어떻게 하면아래메뉴를 밀면서 보일까요? js로 해결하나요?#LY-Left ul#Left-Menu {
position: relative;
width: 180px;
}
#LY-Left ul#Left-Menu li {
height: 30px;
background: url(../../img/kor/left/icn_leftmn.gif) no-repeat;
line-height: 28px;
padding-left: 33px;
}
#LY-Left ul#Left-Menu li:hover {
display: block;
background: url(../../img/kor/left/icn_leftmn_on.gif) no-repeat;
}
#LY-Left ul#Left-Menu li a:link,
#LY-Left ul#Left-Menu li a:visited,
#LY-Left ul#Left-Menu li a:hover,
#LY-Left ul#Left-Menu li a:active {
display: block;
color: #4d4d4d;
font-weight: bold;
text-decoration: none;
letter-spacing: -1px;
}
#LY-Left ul#Left-Menu ul.Left-Menu-Sub {
display: none;
position: absolute;
width: 180px;
padding: 10px 0;
margin-top: 2px;
margin-left: -33px;
background: #fff;
}
#LY-Left ul#Left-Menu li:hover ul.Left-Menu-Sub {
display: block;
}
#LY-Left ul#Left-Menu ul.Left-Menu-Sub li {
background: url(../../img/kor/left/icn_leftmn_in.gif) no-repeat ;
}
#LY-Left ul#Left-Menu ul.Left-Menu-Sub li a:link,
#LY-Left ul#Left-Menu ul.Left-Menu-Sub li a:visited {
display: block;
color: #4d4d4d;
font-weight: normal;
text-decoration: none;
}
#LY-Left ul#Left-Menu ul.Left-Menu-Sub li a:hover,
#LY-Left ul#Left-Menu ul.Left-Menu-Sub li a:active {
display: block;
color: #653f68;
font-weight: bold;
text-decoration: none;
}참고로 html구조는, 이런 식입니다.
div id=LY-Left
ul id=Left-Menu
li
a href=가가가/a
ul class=Left-Menu-Sub
lia href=aaa/a/li
lia href=bbb/a/li
lia href=ccc/a/li
lia href=ddd/a/li
/ul
/li
li
a href=나나나/a
ul class=Left-Menu-Sub
lia href=eee/a/li
lia href=fff/a/li
/ul
/li
/ul
/div
