토글(펼침) 메뉴에 관한 질문입니다. (js/jquery) 채택완료
nanati
9년 전
조회 5,261
안녕하세요.
오랜만에 질문 글 남깁니다.
잘 부탁드립니다.
펼침 메뉴를 만들었는데
아래와 같은 코드를 썼습니다.
</p><p>$(".acco1 dt").click(function() {</p><p> $(".acco1 dd").slideToggle("slow");</p><p> });</p><p> $(".acco2 dt").click(function() {</p><p> $(".acco2 dd").slideToggle("slow");</p><p> });</p><p> $(".acco3 dt").click(function() {</p><p> $(".acco3 dd").slideToggle("slow");</p><p> });</p><p> $(".acco4 dt").click(function() {</p><p> $(".acco4 dd").slideToggle("slow");</p><p> });</p><p>
질문은 두가지 입니다.
1. 위와 같이 나열된 같은 내용의 코드를 더 짧게 줄일 수 있나요?
2. 위의 펼침 메뉴를 특정 사이즈 이하(예: 768px 이하) 일 때만 적용할 수 있는 방법이 있나요?
감사합니다.
댓글을 작성하려면 로그인이 필요합니다.
답변 2개
채택된 답변
+20 포인트
9년 전
- 1
- 2
이런형태겠죠??
이걸
로 slidedl 이라는 클래스를 하나 더 추가해줍니다.
그리고 나서 스크립트에
$(".slidedl dt").click(function() {
$(this).parent().find("dd").slideToggle("slow");
});
라고 해주면 될거같습니다.
로그인 후 평가할 수 있습니다
답변에 대한 댓글 1개
n
nanati
9년 전
댓글을 작성하려면 로그인이 필요합니다.
9년 전
행복동님이 2번째 질의에 답변을 안남기셔서..
if ($(window).width() <= 768) { ... }
window 대신 document 나 body, 또는 element name 으로 지정하셔도 됩니다.
로그인 후 평가할 수 있습니다
답변에 대한 댓글 1개
n
nanati
9년 전
답변 감사합니다 (__)
행복동님이 알려주신 아래의 내용을
$(".slidedl dt").click(function() {
$(this).parent().find("dd").slideToggle("slow");
});
카츠님이 알려주신 아래 코드 ... 부분에 넣으면 되나요?
if ($(window).width() <= 768) {
...
}
----------------------------
해결 했습니다. 감사합니다~
행복동님이 알려주신 아래의 내용을
$(".slidedl dt").click(function() {
$(this).parent().find("dd").slideToggle("slow");
});
카츠님이 알려주신 아래 코드 ... 부분에 넣으면 되나요?
if ($(window).width() <= 768) {
...
}
----------------------------
해결 했습니다. 감사합니다~
댓글을 작성하려면 로그인이 필요합니다.
답변을 작성하려면 로그인이 필요합니다.
로그인
아는 분들에겐 정말 간단한 코딩일지 몰라도,
ㅠ ㅠ 저같이 퍼다가 아이디나 클래스만 변경하는 사람들에게는 정말 어렵습니다 ㅠ ㅠ
짧게 줄이는 것은 알려주신대로 처리하였습니다 ^^