h5-animation v2.0.2

niceapp-animation

说明

对常用的动画，有序进行分组，动画参考了以下仓库的代码。

• animate.css
• magic
• Dynamic
• motion-css
• tuesday
• wickedCSS
• animista
• text cssanimation
• PageTransitions 页面转场

如何扩展动画

所有CSS动画的说明使用注释语法@animate(Config)描述，Config 包含以下属性：

• name 动画名称
• introduce 动画介绍
• append 追加属性，在生成类时用到
  • count: "infinite" 用于需要循环播放的动画
  • duration: 200 单位ms
  • visibility: visible 3d 动画辅助
  • function: animation-timing-function

一个合法的动画声明如下：

/*
@animate({
  name: 'flip,
  introduce: "翻转动画"
})
*/
@keyframes flip {
  from {}
  to {}
}

动画效果类型

• in 入场效果
• out 出场效果
• attention 吸引注意力