메뉴 클릭 시 on 이 되도록 하고 싶은데 어떻게 해야 하나요?
본문
메뉴 클릭 시 on 이 된 상태에서 새로고침을 해도 on 된 상태가 풀리지 않게 하고싶습니다.
(단, 다른 메뉴 클릭 시 클릭한 메뉴에 on 이 되게 하고 싶습니다.)
해당 기능은 어디에서 수정하면 되는지 궁금합니다.
(예전에 어디서 봐서 간단하게 했던 것 같은데, 오래 전에 해서 잘 기억이..ㅠㅠ)
답변 2
그누 원본은 간단하게 안 되고, 빌더 이용하면 기본 지원되는 기능입니다.
배추빌더5 / 아미나 / 나리야 / 이윰 등 모두 지원하는 걸로 알고 있습니다.
관련 빌더들을 다운받아 분석해 보시면 힌트를 얻으실 수 있을 겁니다.
분석해보시면 아시겠지만, 쉬운 기능이 아닙니다.
예전 아주 초보 시절 배추빌더5 소스 분석해보면서 공부한 적 있는데, 눈이 핑핑 돌더라구요.
구현 기본 원리는 URL상의 특정 값과 메뉴표상의 특정값이 같으면 해당 메뉴에 클래스를 추가해 해당 클래스 값이 적용되게 하는 겁니다.
웅푸 님이 링크해주신 방법 경우엔 data 속성을 이용해 로컬저장소에 값을 저장 후 그 값과 url상 값이 같은지 여부로 판별하는 방법이네요.
data-* 속성 : https://homzzang.com/b/html-193
JS indexOf() 메서드 이용해서도 구현하기도 합니다. (목차 5번)
참고로 저는 구현이 어렵고도 귀찮아 배추빌더5 이용 중이네요. 우리처럼 초보는 기본 기능이 빵빵한 빌더 이용하는 게 속시원한 것 같아요. 유지보수는 좀 어렵지만서두요.....
답변을 작성하시기 전에 로그인 해주세요.