react에서 fade_in / out 애니메이션

Kim Jukyung·2021년 5월 12일
0

scss

.fade_out {
    visibility: hidden;
    opacity: 0;
    transition: visibility 0s linear 80ms, opacity 80ms;
}

.fade_in {
    visibility: visible;
    opacity: 1;
    transition: visibility 0s linear 0s, opacity 80ms;
}

jsx

...
return (
   <div
      className={classnames(
        style.sub_gnb, 
        { [style.fade_in]: isShow },
        { [style.fade_out]: !isShow }
      )}
   >
...
profile
front-end javascript vue react jiujitsu

0개의 댓글