category:
Technology
Back to Blog Index
css transitionの書き方
.class {
opacity: 0;
transition: all 1.8s .3s cubic-bezier(0.19, 1, 0.22, 1);
transform: translateY(40px);
}
.class.is-show {
opacity: 1;
transform: translateY(0);
}
transitionは以下。
transition: all 時間 delay easeout;
40px下から、0.3秒後にy座標pxに浮き上がる。