페이지 이동시에도 드롭메뉴 고정 시키고 싶습니다 채택완료
Copy
Document
nav {
width: 150px;
}
ul { padding: 0; }
li {
list-style: none;
line-height: 34px;
}
a {
display: block; /* 범위 확장 */
text-decoration: none;
color: #616161;
text-align: left;
}
.sub_menu { display: none; } /* 서브메뉴들 숨김 */
.snd_menu { }
.trd_menu { }
.selec { } /* 임시 클래스(선택) */
ABOUT
SEASON
F/W 2023
OUTWEAR
TOP
BOTTOMS
ACCESSORIES
S/S 2023
OUTWEAR
TOPS
BOTTOMS
BAGS
ACCESSORIES
COMMUNITY
NOTICE
$(document).ready(function(){
//메뉴 슬라이드
$('#main_menu > li > a').click(function(){
$(this).next($('.snd_menu')).slideToggle('fast');
})
$('.snd_menu > li > a').click(function(e){
e.stopPropagation();
$(this).next($('.trd_menu')).slideToggle('fast');
})
// 버튼 클릭 시 스타일 변경
$('li > a').focus(function(){
$(this).addClass('selec');
})
$("li > a").blur(function(){
$(this).removeClass('selec');
})
})
지금 이 상태인데
해당메뉴를 클릭해서 이동하면 그대로 드롭메뉴가 고정됐으면 좋겠는데 될까요
답변 2개
채택된 답변
+20 포인트
2년 전
Copy
$(document).ready(function(){
//메뉴 슬라이드
$('#main_menu > li > a').click(function(){
$(this).next($('.snd_menu')).slideToggle('fast');
})
$('.snd_menu > li > a').click(function(e){
e.stopPropagation();
$(this).next($('.trd_menu')).slideToggle('fast');
})
// 버튼 클릭 시 스타일 변경
$('li > a').focus(function(){
$(this).addClass('selec');
})
$("li > a").blur(function(){
$(this).removeClass('selec');
})
$('#main_menu a').each(function () {
if (this.href == location.href) {
// $(this).parents('.sub_menu').slideToggle('fast');
$(this).parents('.sub_menu').toggle();
return false;
}
});
})
로그인 후 평가할 수 있습니다
답변에 대한 댓글 1개
댓글을 작성하려면 로그인이 필요합니다.
2년 전
제가 제이쿼리를 사용하지 않는 사람이라... 코드를 짜 드리지는 못하겠지만...
여튼 좌측 펼침메뉴 div 의 아이디가 id="category-side" 인데.
버튼 클릭시 id="category-side" 의 innerHTML 을 세션스토리지에 담아서
링크로 넘어가서는 id="category-side" 의 innerHTML 을 담아놓은 세션스토리지의 데이터로 바꾸면 될 것 같은데요?
로그인 후 평가할 수 있습니다
댓글을 작성하려면 로그인이 필요합니다.
답변을 작성하려면 로그인이 필요합니다.
로그인