[j-Query] Hamburger Menu UI

UI 조건

1. 햄버거 메뉴 버튼 클릭시, 각기 다른 클래스가 입혀진다.
2. 다시 클릭시 기존 햄버거 메뉴로 돌아온다.

구현

See the Pen Untitled by day.binna (@bitnaleeeee) on CodePen.

설명

1. 각 menu trigger 클래스 안의 12개 요소를 선택해주는 함수를 작성한다.
2. this로 총 12개의 menu-trigger를 받고 하나씩 클릭할때마다 각 index값의 1을 더해준 active-(index+1)명의 클래스를 입혀준다.
3. 재클릭시 원래 모양으로 복귀해야하므로 toggleclass를 사용.
4. preventDefault();는 a태그가 실행되지 않도록 막아준다.