• css3 animate基本属性


                                                                          Css3animate属性

    属性

    描述

    Css

    Animation

    所有动画属性的简写属性,除了animation-play-state属性

    Animation:name duration timing-function delay iteration-count

    direction;

    3

    Animation-name

    规定@keyframes动画的名称。

    animation-name:keyframename|none

    3

    Animation-duration

    规定完成一个周期所花费的秒或毫秒。默认是0;

    Animation-duration:time;

    3

    Animaion-timing--function

    规定动画的速度曲线。默认是ease。

    3

    Animation-delay

    规定动画何时开始。默认是0

    Animation-delay:time

    3

    Animation-iteration-count

    规定动画被播放的次数。默认是1.

    Animation-iteration-count:n|infinite

    3

    Animation-direction

    规定动画是否在下一周期逆向的播放。默认是normal。

    Normal是默认值。动画应该正常播放

    Alternate动画应该轮流反向播放

    3

    Animation-play-state

    规定动画是否正在运行或暂停,默认值是”running”。

    Animation-play-state:paused|running;

    Paused:规定动画已暂停

    Running:规定动画正在播放

    3

                                                Css3@keyframes规则

    语法:

             @keyframe animationname{keyframes-selector{css-styles;}}

    描述

    Animationname

    必需,定义动画的名称

    Keyframes-selector

    必需。动画时长的百分比。

    合法值:0-100%

    From(与0%相同)

    To(100%相同)

    Css-styles

    必需。一个或多个合法的css样式属性

                                                                                   定格动画

    描述

    Animationend

    当animation执行完成后js调用的事件

    Animationend

    Moz内核

    webkitanimationEnd

    Webkit内核

    oaimationEnd

    Opera内核

    MSAnimationEnd

    Ie内核

    描述

    Transitionend

    当transition执行完成之后js调用的事件

    Transitionenf

    Moz内核

    webkittransitionEnd

    Webkit内核

    otransitionEnd

    Opera内核

    MSTransitionEnd

    IE内核

    以上是animate的基本属性

  • 相关阅读:
    蓝桥杯 买不到的数目(动态规划)
    部分ftp登不上原因
    glColor3f()函数 表示颜色
    三维模型(X,Y,Z)坐标,UV坐标
    找不到 Windows SDK 版本10.0.18362.0的解决办法
    头文件中的ifndef/define/endif有什么作用?
    pycharm 出现opencv(4.4.0)等等错误如何解决
    灵敏度分析与误差分析
    死磕Spring之AOP篇
    死磕Spring之IoC篇
  • 原文地址:https://www.cnblogs.com/TzSteady/p/7396849.html
Copyright © 2020-2023  润新知