테스트 사이트 - 개발 중인 베타 버전입니다

메뉴 클릭시 이미지 변경 방법이 궁금합니다. 채택완료

바나라바 4년 전 조회 2,173

https://m.innersignal.co.kr/#; 사이드메뉴의 카테고리를 누르면 +가 -로 변경되고, 또다른 카테고리를 누르면 열려있던 카테고리가 닫히면서 -가 +로 이미지가 변경되게 만들고 싶습니다.

addClass를 이용해서 누르면 이미지가 변경되게 만들었는데요

 

문제는 다른 카테고리를 누르면 계속 -인채로 유지된다는점입니다.

어떤식으로 고치면 될까요 ?

 

 

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

답변 1개

채택된 답변
+20 포인트
핑크빈
4년 전

$(".category > li > a").removeClass("on"); // -가 +로 전부적용

$('.category > li >a').parent().siblings('li').children('ul').slideUp(); // 모든 슬라이드 up

이코드를 최상단에 붙어놔보세요.

 

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

답변에 대한 댓글 2개

바나라바
4년 전
감사합니다. 그런데 한가지 문제가 더 생겼습니다.
$(".category > li > a").click(function(){
$(".category > li > a").removeClass("on");
$('.category > li >a').parent().siblings('li').children('ul').slideUp();
$(this).addClass("on");
$(this).parent().siblings("li").children("ul");
$(this).next("ul").slideToggle();
$(this).parent().siblings("li").children("ul").slideUp();
});

여기서 말씀해주신 코드를 붙여넣으니
$(".category > li > a").removeClass("on");
$('.category > li >a').parent().siblings('li').children('ul').slideUp();

열려있는 li를 클릭하면 ul이 닫아지다가 다시 열려버리고 다시 버튼이 -에서 +로 바뀌지 않는데 무슨 문제일까요?
P
Phillips
4년 전
$(".category > li > a").not($(this)).removeClass("on");
$('.category > li >a').not($(this)).parent().siblings('li').children('ul').slideUp();
마지막줄에 이거넣어보시고 안되시면 html css 기재부탁합니다.
그리고 addclasss가아니라 toggleClass로하셔야합니다.. slide도마찬가지구요

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

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

로그인