使用@-webkit-keyframes定义动画效果
/*动画上移动*/
.emoji-move-in {
-webkit-animation: emoji-move-in 0.3s forwards;
animation: emoji-move-in 0.3s forwards;
}
.emoji-move-out {
-webkit-animation: emoji-move-out 0.3s forwards;
animation: emoji-move-out 0.3s forwards;
}
@-webkit-keyframes emoji-move-in {
0% {
height: 0;
}
100% {
height: 200px;
}
}
@-webkit-keyframes emoji-move-out {
0% {
height: 200px;
}
100% {
height: 0;
}
}