im이 jQuery 다중 레벨 CSS 메뉴를 사용하고 마우스를 올리면 각 subnav가 hovered/clicked 목록 항목 바로 아래에 나타납니다.
내가 겪고있는 문제는 선택한 상위 항목의 bg 색상이 서브 네트워크 목록 위로 마우스를 올려 놓을 때 온 - 호버 색상을 유지하지 않는 것입니다.
어떤 도움을 주겠습니까, 몇 시간 동안이 문제로 어려움을 겪어 왔습니다. 간단히 추가jQuery 다중 레벨 CSS 메뉴 on-hoover가 작동하지 않습니다.
.jquerycssmenu{
font-family: 'OxygenBold', arial;
color: #3a4769;
text-transform: uppercase;
line-height: 47px;
font-size: 18px;
padding-left: 80px; /*offset of tabs relative to browser left edge*/
background-image: url(images/nav-repeat.png);
background-repeat: repeat-x;
-webkit-border-top-left-radius: 10px;
-webkit-border-top-right-radius: 10px;
-moz-border-radius-topleft: 10px;
-moz-border-radius-topright: 10px;
border-top-left-radius: 10px;
border-top-right-radius: 10px;
}
.jquerycssmenu ul{
margin: 0;
padding: 0;
list-style-type: none;
}
/*Top level list items*/
.jquerycssmenu ul li{
position: relative;
display: inline;
float: left;
}
/*Top level menu link items style*/
.jquerycssmenu ul li a{
display: block;
padding: 5px 17px 4px 20px;
margin-right: 0; /*spacing between tabs*/
border-bottom-width: 0;
color: #2d2b2b;
text-decoration: none;
}
.jquerycssmenu ul li a:hover {
background-color: #fcae18; /*tab link background during hover state*/
color: #fff;
}
/*1st sub level menu*/
.jquerycssmenu ul li ul{
position: absolute;
text-transform: capitalize;
left: 0;
display: block;
visibility: hidden;
border-top: 1px solid #ff9d14;
}
/*Sub level menu list items (undo style from Top level List Items)*/
.jquerycssmenu ul li ul li{
display: list-item;
float: none;
}
/*All subsequent sub menu levels vertical offset after 1st level sub menu */
.jquerycssmenu ul li ul li ul{
top: 0;
}
/* Sub level menu links style */
.jquerycssmenu ul li ul li a{
font-family: 'OxygenRegular', arial;
font-size: 15px;
width: 160px; /*width of sub menus*/
background: #fcae18;
color: #fff;
padding: 0 20px;
margin: 0;
border-top-width: 0;
border-bottom: 1px solid #ff9d14;
}
.jquerycssmenu ul li ul li a:hover{ /*sub menus hover style*/
background: #ff9d14;
color: #fff;
}
/* ######### CSS classes applied to down and right arrow images ######### */
.downarrowclass{
position: absolute;
top: 20px;
right: 5px;
}
.rightarrowclass{
position: absolute;
top: 5px;
right: 5px;
}
하하 좋은 생각, 고마워 그렉! – rid
원본에서 편집을했는데 위의 해결책을 사용하면 추가 클래스를 추가하지 않아도됩니다. –