Nguồn ngoài
Animation for the Web: A Guide to Advanced CSS and Animation Techniques
Welcome to the wonderful world of CSS Animations! In this textbook by Rosemary Barker, we will be looking at manipulating HTML objects in 2D. These topics will be explored: (1) Transforms Transitions and Eases, (2) Keyframe Animations, (3) Clip-paths and Shapes Variables, and (4) SVG Graphics Tools of the Trade Using Greensock (a JavaScript Library) for Animations.
- Tác giả
- Rosemary Barke
- Nhà xuất bản
- HACC, Central Pennsylvania’s Community College
- Nguồn
- LibreTexts
- Giấy phép
- CC BY-NC
- Ngôn ngữ
- EN
- Danh mục
- Công nghệ thông tin
Mục lục· 26 mục
- 01: An Introduction to Animating with CSS
- 1.01: Introduction to CSS Animation
- 1.02: Becoming Familiar with CodePen
- 1.03: Working with Cartesian Coordinates
- 02: Understanding 2D CSS Transforms
- 2.01: 2D CSS Transforms - rotate()
- 2.02: 2D CSS Transforms - scale()
- 2.03: 2D CSS Transforms - skew()
- 2.04: 2D CSS Transforms - translate()
- 2.05: Transform-origin Property
- 03: CSS Transitions and Eases - Creating Motion on the HTML Page
- 3.01: CSS Transitions - Creating Motion on the HTML Page
- 3.02: Eases - Adding Character and Style to Motion
- 04: CSS Keyframe Animations - Animating at Points in Time
- 05: CSS3 Clip-paths Shapes Variables and Working with SVGs
- 5.01: Clip-path Property
- 5.2 CSS Shapes Introduction
- 5.3: Shape-outside
- 6: CSS Variables and SVG Graphics
- 6.1 CSS Variables
- 6.2 Working with SVGs
- 6.3 SVG Mask Animations
- 7: Tools of the Trade - Exporting and Optimizing SVGs and Using the Greensock Library for Animations
- 7.1 Exporting SVGs from Illustrator
- 7.2 Optimizing SVG Files
- 7.3 Using the GSAP (aka Greensock) Animation Library