Animation

1. transform ?

1.1. 2d

1.1.1. translate()

1.1.1.1. Tryit

1.1.2. translateX()

1.1.3. translateY()

1.1.4. rotate()

1.1.4.1. Tryit

1.1.5. scale()

1.1.5.1. Tryit

1.1.6. scaleX()

1.1.6.1. Tryit

1.1.7. scaleY()

1.1.7.1. Tryit

1.1.8. skew()

1.1.8.1. Tryit

1.1.9. skewX()

1.1.9.1. Tryit

1.1.10. skewY()

1.1.10.1. Tryit

1.1.11. matrix()

1.1.11.1. Tryit

1.2. 3d

1.2.1. rotateX()

1.2.1.1. Tryit

1.2.2. rotateY()

1.2.2.1. Tryit

1.2.3. rotateZ()

1.2.3.1. Tryit

2. transition

2.1. transition

2.1.1. Tryit

2.2. transition-delay

2.2.1. Tryit

2.3. transition-duration

2.3.1. Tryit

2.4. transition-property

2.4.1. Tryit

2.5. transition-timing-function

2.5.1. Tryit

3. animation

3.1. @keyframes

3.1.1. Tryit

3.2. animation-name

3.2.1. Tryit

3.3. animation-duration

3.3.1. Tryit

3.4. animation-delay

3.4.1. Tryit

3.5. animation-iteration-count

3.5.1. Tryit

3.6. animation-direction

3.6.1. Tryit

3.7. animation-timing-function

3.7.1. Tryit

3.8. animation-fill-mode

3.9. animation

3.9.1. Tryit

4. libraries support animation

4.1. Velocity.js

4.1.1. http://velocityjs.org/

4.2. Snap.svg

4.2.1. http://snapsvg.io/

4.3. AniJs

4.3.1. http://anijs.github.io/

4.4. Anime.js

4.4.1. http://anime-js.com/

4.5. Animate.css

4.5.1. https://daneden.github.io/animate.css/

4.6. GreenSock (GSAP)

4.6.1. https://greensock.com/

5. Example

5.1. Basic CSS animation

6. animation api (javascript)

7. SVG animation