css - 同一动画的多个计时功能

Question

我可以为同一个动画放几个计时函数吗..

div{  
width:100px;  
height:100px;  
background:red;  
position:relative;  
animation:mymove 3s;  
animation-iteration-count:2;  
animation-timing-function: ease;}  

@keyframes mymove{ 
0% {top:0px;}  
25% {top:100px;}  
100% {top:200px;}}    

我希望它缓和从 0% 到 25% 和缓和从 25% 到 100%

Answer 1

您可以使用 animation-timing-function: cubic-bezier(n,n,n,n);

定义一个唯一值

此站点可帮助您对其进行自定义:http://cubic-bezier.com/