Jeffrey WayOct 26, 2011Lessons: 23Length: 2.7 hours

Next lesson playing in 5 seconds

Overview
Transcript

5.3 Create a CSS-Only Slider (Part 2)

Over the course of the final two lessons in this course, we’re going to dive into keyframe animations! To illustrate some of the abilities that animations provide us, we’ll build a fun CSS3-only slider. As you might imagine, this sort of functionality is generally delegated to JavaScript (and it still should), but we’re going to have some fun and see if we can accomplish the same effect with 100% CSS!

Make sure, upon completing this episode, that you run your final stylesheet through Prefixr.com , so that you support as many browsers as possible!

1.Introduction
1 lesson, 00:53

1.1
Introduction
00:53

6.Conclusion
1 lesson, 00:42

6.1
Conclusion
00:42

Jeffrey Way

I used to be the editor of Nettuts+ and head of web development courses at Tuts+.

jeffrey_way

CSS3 Essentials

Next lesson playing in 5 seconds

5.3 Create a CSS-Only Slider (Part 2)

1.Introduction
1 lesson, 00:53

1.1
Introduction
00:53

2.The Basics
9 lessons, 50:30

2.1
Border-Radius
04:53

2.2
Box-Shadow
06:32

2.3
Prefixr
03:11

2.4
Text-Shadow
03:43

2.5
Gradients
10:39

2.6
Columns
04:51

2.7
An Introduction to Media Queries
06:24

2.8
Transition Basics
04:44

2.9
Custom Fonts with @font-face
05:33

3.CSS Selectors
5 lessons, 22:25

3.1
Selector Basics
06:47

3.2
Adjacent Selectors
02:32

3.3
Sibling Combinators
02:23

3.4
Attribute Selectors
06:39

3.5
First-Line and First-Letter
04:04

4.Transformations
4 lessons, 43:54

4.1
Introduction to Transformations
03:50

4.2
Build a 3D Flipping Card
14:48

4.3
Advanced Shadows and CSS Counters
05:49

4.4
Sequential Animations and Image Captions
19:27

5.Advanced Topics and Projects
3 lessons, 41:27

5.1
Repeating Gradients and Shuffled Paper
16:35

5.2
Create a CSS-Only Slider (Part 1)
09:01