[Jquery] data-tab(tab content) 탭메뉴 만들기
가장 기본적인 탭메뉴로 상단 탭을 누르면 선택된 내용을 불러오게 합니다. . show()/. hide() 등 다양하게 탭메뉴를 만들 수 있지만 제가 사용해 본 결과 깔끔하고 오류 없이 사용할 수 있어 자주 쓰고 있는 방법입니다. html구조도 크게 타지 않아 만들기 쉽습니다! HTML 누를 상단 메뉴 부분과 보일 내용 부분을 넣어주는데 클릭될 상단메뉴에는 data-tab을 넣어 선택될 내용의 id 값을 넣어줍니다. 콘텐츠 부분에는 data-tab에 선택되는 id값을 넣어줍니다. 추가로 클래스를 활용하여 선택됐을 때 클래스를 먹여 스타일 보이고 사라지는 효과를 줄거니 가장 먼저보이는 부분에 클래스를 추가로 넣어주세요! CSS * jquery중심으로 보여드리기 위해 작성한 글이니 스타일은 개인적으로 손보시면..
웹디자인|웹퍼블리셔/Jquery
2023. 7. 3. 22:43