display: none을 활용한 element의 숨김/표시는 가장 기본적인 방식의 show/hide 처리방법입니다. 다만 CSS transition이 적용되지 않기 때문에 자연스러운 애니메이션을 구현하기 위해서는 약간의 추가적인 작업을 필요로 합니다. 간단한 클래스 추가 과정을 통해서 display: none을 활용한 show/hide 처리에 애니메이션을 추가하는 방법을 알아보고자 합니다. 기본적으로 animation을 display 개체에 추가해서 애니메이션을 추가함과 함께 display: none 속성을 애니메이션 재생 이후에 딜레이를 주어 추가함으로써 자연스러운 트랜지션이 가능하게 하는 방식입니다. [2022-02/2022-06 내용 추가] 본 내용은 display: none에 애니메이션을 추가하..
