反馈型组件: 比如Progress进度条, Drawer抽屉, Modal对话框等....在实现动画前大家最好对关键帧动画有所了解,我相信大家都比较了解. 这种关窗帘动画一种实现方式就是通过控制元素宽度, 从0到100%, 然后添加适当的要是优化即可....所以说作为一个好的交互设计来说, 要让交互体验更顺畅,这里提供一种方式,就是加载的文本在窗帘宽度变化的同时,文字的透明度从0变化到1,这样就会柔和很多, 所以动画可以这么改:
&::after {...: 0;
color: rgba(255, 255, 255, 0);
}
100% {
width: 100%;
color: rgba(255, 255, 255,...的内容了, content其实还有更多的功能,比如用纯css实现一个计数器,大家可以研究学习一下.