목록으로

펼침상태를 유지하고자 합니다 채택완료

내쿠 4년 전 조회 1,576

답변 2

-------------test.html----------------

div, ul, li { margin:0; padding:0; }

#Menu {
   float:left;
   margin:0px 5px 3px 5px;
   padding:0 0 3px 0;
   background-color:#5c5c5c;
}

#Menu ul li {
float:left;
list-style-type:none;
}

#Menu a {
   height:16px;
   color:#f1f1f1;
   font-family:arial;
   font-size:12px;
   padding:0 10px 0 10px;
   text-decoration:none;
}

#Menu ul ul {
   display:none;
   position:absolute;
   background-color:#5c5c5c;
}

#Menu ul li:hover ul {
display: block;
}

#Menu ul ul li {
float:none;
}

</style>

<ul>
<li><a href="end.html">결과페이지로</a></li>
<li><a href="#">Sub Menu 2</a></li>
<li><a href="#">Sub Menu 3</a></li>
</ul>

</li>

</ul>
</div>

-------------test.html----------------

---결과페이지---

div, ul, li { margin:0; padding:0; }

#Menu {
   float:left;
   margin:0px 5px 3px 5px;
   padding:0 0 3px 0;
   background-color:#5c5c5c;
}

#Menu ul li {
float:left;
list-style-type:none;
}

#Menu a {
   height:16px;
   color:#f1f1f1;
   font-family:arial;
   font-size:12px;
   padding:0 10px 0 10px;
   text-decoration:none;
}

#Menu ul ul {
   display:none;
   position:absolute;
   background-color:#5c5c5c;
}

#Menu ul li:hover ul {
display: block;
}

#Menu ul ul li {
float:none;
}

</style>

<ul>
<li><a href="end.html">결과페이지로</a></li>
<li><a href="#">Sub Menu 2</a></li>
<li><a href="#">Sub Menu 3</a></li>
</ul>

</li>

</ul>
</div>

<div>
결과페이지입니다! <br>
선택한 서브메뉴("결과페이지로")가 나온 상태로 펼침 상태가 유지 되고자 합니다.

</div>

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

위는 동작합니다..

위 내용대로 결과페이지에 선택한 서브메뉴("결과페이지로")가 나온 상태로 펼침 상태를 유지하려면 어데를 손봐야 하는지요..

미리 감사합니다.

#그누보드5 #서브메뉴 #풀다운메뉴

댓글을 작성하려면 로그인이 필요합니다.

답변 2개

정렬:

채택된 답변

+20 포인트

폭주죽

4년 전

#Menu ul ul {
   display:none;
   position:absolute;
   background-color:#5c5c5c;
}

#Menu ul li:hover ul {
display: block;
}
여기보면 hover 했을떄 보이도록 해놓은거잖아요,

결과페이지에서는 그냥 저 빨간부분을 display:block; 으로 바꾸세요

로그인 후 평가할 수 있습니다

답변에 대한 댓글 1개

�

내쿠

4년 전

아... 열심히 공부하겠습니다.. 감사합니다

댓글을 작성하려면 로그인이 필요합니다.

jayz

4년 전

호버로 하게 되면. 다른 메뉴를 찾다보면 접히지 않는 이슈가 발생될수 있을 것 같네요.

해당 메뉴를 클릭하였을때 그 서브메뉴가 지속적으로 살아 있길 원하시니.

click 이벤트 발생시 해당 메뉴에 class 부여로 display:block; 부여하면 될것 같습니다.


                
                $(document).ready(function () {
  $("#menu ul li").click(function () {
    $(this).</code><code data-lang="javascript">parent('ul').addClass("on");  //해당 li를 클릭하면 그 위에 ul 에게 클래스 on을 부여한다.
  });
});</code></pre>

<p><code data-lang="javascript">
            

 

그리고 빠져나와 다른 메뉴에 hover 시에는 removeClass 로 on 을 제거하는 방식으로 구현하면 될것같네요.

 

저는 당장 생각나는 방법은 이것뿐이네여..

로그인 후 평가할 수 있습니다

답변에 대한 댓글 1개

�

내쿠

4년 전

옙! 모르지만 한 번 도전해 보겠습니다.. 감사합니다.

댓글을 작성하려면 로그인이 필요합니다.

답변을 작성하려면 로그인이 필요합니다.

로그인

펼침상태를 유지하고자 합니다 채택완료

답변 2개

답변에 대한 댓글 1개

답변에 대한 댓글 1개

공유하기