前端实现动画的方法汇总 ٩( 'ω' )و
目录 1. css3的 transition 属性 2. css3的 transform 属性 3. css3的 animation 属性 4. Jquery的 animate 函数 5. 使用插件 6. 原生JS动画 7. 使用 canvas 绘制动画 8. 使用 gif 图片 9. CSS动画和JS动画的优缺点 1. css3的 transition transition 属性: 用来设置样式的属性值是如何从一种状态平滑过渡到另外一种状态 语法: transition : property duration timing-function delay ; transition 是一种简写属性,它可以拆分为四个过渡属性: 即,你可以 transition: 值1,值2,值3,值4 这样写; 也可以: transition-property: 值1 transition-duration:值2 transition-timing-function:值2 transition-delay:值4 这样写; 值 描述 transition-property 规定设置过渡效果的 CSS 属性的名称。 transition-duration 规定完成过渡效果需要多少秒或毫秒。 transition-timing-function 规定速度效果的速度曲线。 transition-delay