• 카테고리

    질문 & 답변
  • 세부 분야

    자격증 (디자인)

  • 해결 여부

    미해결

변수를 사용하여 탭 기능을 구현해도 될까요?

21.02.23 01:02 작성 조회수 189

2

$(function(){
  $(‘.btn a’).click(function(){
    var tab_n = $(this).index()
    $(‘.tab’).hide()
    $(‘.tab’).eq(tab_n).show()

    $(‘.btn a’).removeClass(‘active’)
    $(this).addClass(‘active)

    return false;
 })
})

<div class="tab tab1"> 이런식으로 tab1 tab2의 클래스 값에 tab를 추가한 다음에 , Btn > a의 순서값을 변수로 잡아서 스크립트를 작성해보았는데요,

이렇게 변수처리해서 사용해도 되나요?

답변 2

·

답변을 작성해보세요.

2

탭메뉴의 개수가 변동이 있는 경우는 말씀하신 것처럼 하시는 것도 좋은 방법입니다.
하지만 이건 시험이니까 쉽고 명확한 방법 곧, 실수하지 않는 방법으로 영상처럼 만드시는게 좋습니다.
변수처리해서 만든다고 더 좋은 점수를 주는 것도 아니니까 굳이 실수의 위험부담을 갖지 마세요.

코딩웍스 강의 중에 [HTML+CSS+JQUERY 포트폴리오 실전 퍼블리싱]라는 실전 예제 강의에 [탭 메뉴 콘텐츠- 스타일 02(실전 제작) with jQuery] 강의에서는 attr() 메서드를 사용해서 만드는 제이쿼리 탭메뉴도 있어요.

실전 작업에서는 좀 복잡해도 위에처럼 자동화가 되는 탭메뉴 만드는게 맞지만 시험이니까 쉽게 영상처럼 연습하세요.

1

ohl0226님의 프로필

ohl0226

질문자

2021.02.23

자세한 설명 감사합니다!