css 질문 입니다.
본문
#top_gnb li.over { display:inline-block;margin:0;padding:0;line-height:45px;}
#top_gnb li.over a { display:inline-block;color:#fff;padding:0 30px;font-size:14px;text-align:center; }
#top_gnb li.over a:hover { color:#fbc404; text-decoration:none}
#top_gnb ul.sub { display:none; }
#top_gnb ul li.over:hover > ul.sub { display:block; position:absolute; top:45px; width:120px; background:#10465f; padding:5px 5px;}
#top_gnb ul.sub > li { line-height:22px; padding:0; margin:0; }
#top_gnb ul.sub > li a { width:120px; text-align:left; color:#fff; font-size:13px; padding:4px; margin:0;}
#top_gnb ul.sub > li a:hover { width:112px; padding:4px; margin:0; background:#17698f; }
<li class="over">
<a href="#">그때그시절</a>
<ul class="sub">
<li><a href="">서브메뉴01</a></li>
<li><a href="">서브메뉴02</a></li>
<li><a href="">서브메뉴03</a></li>
</ul>
</li>
예를들어 "그때그시절" 1차메뉴에 오버시 하위메뉴가 출력이 되는데요
하위메뉴 영역에 들어서면 "그때그시절" 메뉴의 롤오버 상태가 해제가 되어서 오버컬러 노란색이 풀리는데요
유지 하게끔 할려면 어떻게 수정해야 될까요.
서브메뉴 영역에 마우스 오버시에도 1차메뉴는 롤오버 컬러 유지 입니다.
!-->
답변 2
#top_gnb li.over a:hover { color:#fbc404; text-decoration:none}
>>
#top_gnb li.over:hover { color:#fbc404; text-decoration:none}
a:hover라서 a를 벗어나면 다시 돌아가는거에요.
a의 위인 li.over:hover를하면 아래 ul.sub로가도 il.over에 올라가 있기 때문에 색이 유지되실꺼에요.
스크립트도 올려주세여
답변을 작성하시기 전에 로그인 해주세요.