# Property Description

The -o-transition-timing-function property is used to describe how the intermediate values of the CSS properties being affected by a transition effect are calculated.

This easing function is specified using a cubic Bezier curve defined by four control points; the first and last of these are predefined to be (0, 0) and (1, 1). This property lets you define the values of the other two points, either using keywords to set them to predefined values, or to custom values.

This property has the following syntax:

    -o-transition-timing-
    function:
      ease | linear | ease-in |
      ease-out | ease-in-out |
      cubic-bezier(<number>,
        <number>,<number>,<number>)
    [, ease | linear | ease-in |
      ease-out | ease-in-out |
      cubic-bezier(<number>,
        <number>,<number>,<number>)
    ]

# Property Values

Value | Description
--- | ---
ease | Specifies the easing function to cubic-bezier(0.25, 0.1, 0.25, 1.0)
linear | Specifies the easing function to cubic-bezier(0.0, 0.0, 1.0, 1.0)
ease-in | Specifies the easing function to cubic-bezier(0.42, 0.0, 1.0, 1.0)
ease-out | Specifies the easing function to cubic-bezier(0.0, 0.0, 0.58, 1.0)
ease-in-out | Specifies the easing function to cubic-bezier(0.42, 0.0, 0.58, 1.0)
ease-bezier | Specifies a cubic bezier curve to use as the easing function. The four number values specify the P1 and P2 points of the curve as (x1, y1, x2, y2). All values must be in the range [0.0, 1.0] inclusive

# Browser Support

Firefox | IE | Chrome | Opera | Safari

# Miscellaneous Information

Inherited: | No
Defined In: | Opera Specific
Initial Value: | ease
Applies To: | All elements, :before and :after pseudo elements