OSX 메뉴 스타일로 페이드 아웃하면서 요소를 숨기기
웹상에서도 이 분위기를 재현하고 싶어서, CSS transition 으로 해 보려고 생각했지만, 이하의 코드라면 애니메이션하지 않는다.
.menu {
transition: none;
&.hidden {
display: none;
opacity: 0;
transition:
display 0s linear 0.3s,
opacity 0.3s ease 0s;
}
}
실은
display 프로퍼티는 transition 에 지정할 수 없기 때문에, 대신에 visibility 를 사용해 할 필요가 있다..menu {
transition: none;
&.hidden {
visibility: hidden;
opacity: 0;
transition:
visibility 0s linear 0.3s,
opacity 0.3s ease 0s;
}
}
Reference
이 문제에 관하여(OSX 메뉴 스타일로 페이드 아웃하면서 요소를 숨기기), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다 https://qiita.com/shota_hamada/items/6c42698b2c69bb995578텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
우수한 개발자 콘텐츠 발견에 전념
(Collection and Share based on the CC Protocol.)
좋은 웹페이지 즐겨찾기
