search

ckinmind / react-cnode

👨🏻‍💻React构建的cnode社区(附详细问题说明)
https://ckinmind.github.io/react-cnode
15 stars 7 forks source link

关于animation动画(keyframes) #21

Open ckinmind opened 7 years ago

ckinmind commented 7 years ago

1. 下滑动画

.common-header {
    height: 50px;
    z-index: 999;
    position: relative;
    background: @style-main;
    animation: move-down 0.3s ease-out;
}
@keyframes move-down {
    0% {
        transform: translate(0, -10px);
    }
    100% {
        transform: translate(0, 0);
    }
}