如何去除cssanimation的渐变过程
需求
在react或者vue这种单页⾯应⽤的项⽬⾥，我们使⽤定时器来实现动画时需要做销毁定时器操作，但是有时候是个很⼩的动画效果，也要做销毁，这个挺⿇烦的。那我们为什么不⽤css动画代替呢？
做法
@keyframes 的属性是0%到100%，假如我们写的是0%-100%，那绝对会有渐变效果
360浏览器怎么下载网页上的视频@keyframes twinkling{
精彩绝伦什么意思
0%{
opacity:0;
}
100%{
opacity:1;
}
}
那所以我们换⼀个写法，0%-50%的时间显⽰，51%-100%的时间隐藏，不就没有过渡效果了嘛。
// ⼀闪⼀闪动画
.twinkle{
animation: twinkling 0.5s infinite linear;
莱芜风景区}
.animated{
animation-duration:0.5s;
}
@keyframes twinkling{
宝龙地产
防火栓
0%,50%{
opacity:0;
}
51%,100%{商招
opacity:1;在工作方面
}
}
动物防疫条件审查办法
结论
那所以聪明的你⼀定也发现了，@keyframes 的百分⽐值的实质就是⼀个时间进度条。
