css缩放动画

?

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23

.right {   background: #9DE4DB;   -webkit-animation-name: scaleDraw; /*关键帧名称*/   -webkit-animation-timing-function: ease-in-out; /*动画的速度曲线*/   -webkit-animation-iteration-count: 1;  /*动画播放的次数*/   -webkit-animation-duration: 0.5s; /*动画所花费的时间*/   }   @keyframes scaleDraw {  /*定义关键帧、scaleDrew是需要绑定到选择器的关键帧名称*/   0%{       transform: scale(1);  /*开始为原始大小*/   }   25%{       transform: scale(1.02); /*放大1.1倍*/   }   50%{       transform: scale(1);   }   75%{       transform: scale(1.02);   } }