Craig CampbellAug 23, 2013Lessons: 19Length: 2.2 hours

Next lesson playing in 5 seconds

Overview
Transcript

3.3 Using Perspective in WebKit Browsers

WebKit browsers such as Chrome support the use of perspective in our 3D transformations. In this lesson we discuss how to add perspective to our portfolio elements.

1.Introduction
1 lesson, 01:26

2.3D Transitions
2 lessons, 19:55

2.1
A Primer on Transitions
09:50

3.Project 1: 3D Transitions
8 lessons, 55:56

3.1
Filling in the HTML (3D Transitions)
06:35

3.3
Using Perspective in WebKit Browsers
06:13

3.4
Animated 3D Mouseovers
07:06

3.5
Fallback for Non-WebKit Browsers
03:47

3.6
Animating from Beginning to End
08:14

3.7
Animation Properties
09:09

3.8
Adding Keyframes in Between
06:16

4.Project 2: Advanced Looping Animation
7 lessons, 54:11

4.1
Preparing Images for Animation
11:42

4.3
Placing Images with CSS
10:27

4.6
Animating the Tail and Ear
04:47

4.7
Animating the Fences
08:18

5.Conclusion
1 lesson, 01:04

Craig has been doodling on computers since the first time he opened Paintbrush in Windows 3.0 in 1990. Since then, he has constantly sought new and exciting ways to make beautiful things on computers.

craigsoup

Advanced CSS3 Animations

Next lesson playing in 5 seconds

3.3 Using Perspective in WebKit Browsers

1.Introduction
1 lesson, 01:26

1.1
Introduction
01:26

2.3D Transitions
2 lessons, 19:55

2.1
A Primer on Transitions
09:50

2.2
3D Transformations
10:05

3.Project 1: 3D Transitions
8 lessons, 55:56

3.1
Filling in the HTML (3D Transitions)
06:35

3.2
Styling the Page
08:36

3.3
Using Perspective in WebKit Browsers
06:13

3.4
Animated 3D Mouseovers
07:06

3.5
Fallback for Non-WebKit Browsers
03:47

3.6
Animating from Beginning to End
08:14

3.7
Animation Properties
09:09

3.8
Adding Keyframes in Between
06:16

4.Project 2: Advanced Looping Animation
7 lessons, 54:11

4.1
Preparing Images for Animation
11:42

4.2
Filling in the HTML
06:45

4.3
Placing Images with CSS
10:27

4.4
Animating the Legs
07:48

4.5
Animating the Body
04:24

4.6
Animating the Tail and Ear
04:47

4.7
Animating the Fences
08:18

5.Conclusion
1 lesson, 01:04

5.1
Final Thoughts
01:04

Advanced CSS3 Animations

Next lesson playing in 5 seconds

3.3 Using Perspective in WebKit Browsers

1.Introduction1 lesson, 01:26

2.3D Transitions2 lessons, 19:55

3.Project 1: 3D Transitions8 lessons, 55:56

4.Project 2: Advanced Looping Animation7 lessons, 54:11

5.Conclusion1 lesson, 01:04

1.Introduction
1 lesson, 01:26

2.3D Transitions
2 lessons, 19:55

3.Project 1: 3D Transitions
8 lessons, 55:56

4.Project 2: Advanced Looping Animation
7 lessons, 54:11

5.Conclusion
1 lesson, 01:04