잿꽃's posting Garden

2022.05.10 - [WEB] - 자바스크립트로 메뉴 dropdown - slidedown효과 만들기 자바스크립트로 만드는 메뉴 dropdown - slidedown효과 자바스크립트로 만드는 서브메뉴 slidedown효과 자바스크립트로 메뉴를 만들 때 제이쿼리를 이용하지 않고 dropdown시에 slidedown의 효과를 만들고 싶은데 단순히 height값만 조정으로는 잘 되지 않았 flowerofashes.tistory.com 저번 글에 이어서 자바스크립트로 메뉴가 나타나는 효과 중 fade-in를 적용해본다. 0. CSS의 :hover를 이용하여 CSS로만 구현하기 .menu_list .main .sub{ opacity: 0; visibility: hidden; transition: all 0.4..

자바스크립트로 만드는 서브메뉴 slidedown효과 자바스크립트로 메뉴를 만들 때 제이쿼리를 이용하지 않고 dropdown시에 slidedown의 효과를 만들고 싶은데 CSS를 단순히 height값만 조정으로는 잘 되지 않았다. 평소 궁금하던 차에 검색을 해보았다. 이유가 height에 transition이 작동하지 않는다라는 답변을 보았는데 단순히 그런 문제인지 왜 작동하지 않는지 확인해보기로 했다. 이것은 단순히 CSS로 구현했을 때에도 해당되는 내용이다. 0. CSS의 :hover를 이용하여 CSS로만 구현하기 .menu_list .main .sub{ height: 0; overflow: hidden; transition: all 0.4s; } .menu_list .main:hover .sub{ h..