Web Animation: CSS -> SVG -> JavaScript [Sept. 2020 Update]

Web Animation: CSS -> SVG -> JavaScript [Sept. 2020 Update], css animation -- > svg animation -- > Interactive javaScript Animation == Full stack of web animations [Theory&Practice]

Highest Rated

Created by Alexandr Tyurin

English

English, Arabic

PREVIEW THIS COURSE - GET COUPON CODE

Description

Interactive Web Animations [JavaScript, SVG, CSS & HTML]

Full specification of web animations at the level of markup languages CSS & SVG and programming language JavaScript.

At the end of this course, you will have access to a full stack of web animation technologies.

CURRICULUM:

1. History of Web Animations

2. CSS Animations

- CSS Animation properties

- CSS Keyframe rule

- CSS Transitions

3. SVG Animations

- SVG Animation elements

- Attribute to identify the target element for an animation

- Attributes to control the timing of the animation

- Attributes that define animation values ​​over time

- Attributes that control whether animations are additive

- SVG elements, attributes and properties that can be animated, and we will also learn Interface Time Event

- Interactivity features in SVG

4. JavaScript Animations

- getElementById() method

- Call planning method setinterval()

- addEventListener() method

- getAttribute & setAttribute methods

- How to penetrate the complex SVG attributes of elements using regular expressions

- 3d positioning

- The functions of constructors

- Creation of SVG primitives

- Сreating arrays of objects, managing their properties

- Capabilities of Web Animation using masks & clip path

- Web Animations API

- Combination of animation techniques

All practical examples of animations in this course are available for download and experiment.

,