做爰直播网站,最好的网站建设团队,四川建设网证书查询平台官网,北京市建设教育协会网站首页先说应用
1.动画循环#xff0c;复杂的动画用animation。在遇到很复杂的动画那就用animation。因为animation可以定义关键帧。那你就可以控制每一帧的动画效果。
2.简单的动画#xff0c;事件触发用transition。当页面中的动画是自己执行的那么我们考虑用animation#xf…先说应用
1.动画循环复杂的动画用animation。在遇到很复杂的动画那就用animation。因为animation可以定义关键帧。那你就可以控制每一帧的动画效果。
2.简单的动画事件触发用transition。当页面中的动画是自己执行的那么我们考虑用animation因为transition是需要借助伪类、js、madia触发的。常见的伪类是hover focus。 常见的js就比如click事件。media可以用于页面缩小到1000px你可以展示你需要的动画。
区别
一、语法 过渡——transition: 属性名 完成时间 速度曲线 延迟时间; 动画——需要先定义关键帧再通过animation属性引用关键帧 二、触发 过渡需要借助伪类、js、media触发 动画自动触发 三、执行次数 过渡执行一次后不会执行但是可以借助transitionEnd事件添加循环 动画可以通过属性设置循环次数 四、复杂度 过渡简单动画效果可以通过属性展示动画的速度效果 动画复杂动画效果可以定义关键帧控制每一帧的动画效果
详细
transition过渡效果
语法 transition: property duration timing-function delay;
值描述propertycss属性的名称duration多长时间完成timing-function转速曲线delay效果开始的时候
animation动画效果
语法 animation: name duration timing-function delay iteration-count direction fill-mode play-state;
值描述name定义的名称duration多长时间完成delay开始前多长的延迟iteration-count播放几次direction指定是否应该轮流反向播放动画fill-mode结束的状态play-state指定动画是否正在运行或已暂停
