반응형 숨겨진 메뉴1 [HTML/CSS] 사이드바 메뉴 만들기 : 나타나는 2차 메뉴 만들기 feat. transform: translate 오늘은 사이드바 메뉴를 만들어 보자. 사이드 메뉴는 이름에 나와 있듯이 사이트의 상단에 위치한 일반적인 메뉴 바와 달리 사이트의 측면에 있는 메뉴 바를 일컫는다. 우리는 이런 사이드바 중에서도 스크롤을 따라오는 메뉴 바를 만들어 사이트의 스크롤이 내려가더라도 항상 화면의 측면에 존재하며, 숨겨진 사이드바가 마우스 포인터를 인식하게 되면 나타나게 되는 사이드바 메뉴를 만들어 보고자 한다. 우선 아래의 완성된 이미지를 보자. 우선 완성된 이미지를 보자 위의 이미지를 보면, 평소에는 왼쪽 벽 속에 숨겨져 보이지 않는 메뉴 바가 마우스 커서를 인식하는 순간 나타나는 구조를 가지고 있는 사이드바의 모습을 보여주며, 2차 메뉴인 드롭다운의 기능 또한 갖고 있다. 시작에 앞서 2차 메뉴의 드롭다운 메뉴를 구현해 보고.. 2023. 5. 16. 이전 1 다음 반응형