O'Reilly logo

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

Fine-tuning CSS transitions with the transition-timing-function property

Book Description

CSS transitions are a great way to make your pages feel more interactive and dynamic. To control the pacing of those transitions, you need to use the transition-timing-function property. By using this property, you can specify easing rules with great granularity, so a transition can change speed as it's being executed.

Why is it important?

Default CSS transitions are linear and—let’s face it—boring. You need the transition-timing-function property to customize your transitions and enhance how your design feels to end users.

What you’ll learn—and how you can apply it

Understand the principles behind easing functions, and learn how to use the transition-timing-function property to employ different easing functions and customize their values.

This lesson is for you because…

  • You're a web designer or frontend developer who wants to make the most of your interactive page designs

Prerequisites

  • Basic familiarity with HTML and CSS

Materials or downloads needed in advance

  • None