hamburger menu1 CSS 햄버거 메뉴에 애니매이션 효과 넣기 흔히 햄버거 메뉴라고 하는 접혔다 펼쳐졌다가 하는 메뉴 버튼입니다. 이 메뉴 버튼에 애니매이션 효과를 주는 방법 입니다. 메뉴가 접혀 있을 때는 햄버거 모양에서 펼쳐지면 X모양으로 자연스럽게 변하는 소스입니다. HTML 삽입 미리보기할 수 없는 소스 클릭해서 확인 해 보세요. CSS .container { display: inline-block; cursor: pointer; } .bar1, .bar2, .bar3 { width: 35px; height: 5px; background-color: #333; margin: 6px 0; transition: 0.4s; } .change .bar1 { -webkit-transform: rotate(-45deg) translate(-9px, 6px); trans.. 2022. 7. 19. 이전 1 다음 반응형