CSS Aliases for Webkit Prefixes in Opera Presto 2.12

Introduction

Opera supports certain -webkit- prefixes and will use these when applying styles as described here.

Supported Properties

Two different types of prefixes are supported, details regarding how they are supported are below.

1. -webkit-linear-gradient

   -webkit-linear-gradient and -o-linear-gradient will behave identically and the following rules will be obeyed when evaluating styles.

   • Duplicate properties will not be preserved when both -webkit-linear-gradient and -o-linear-gradient are found. Whichever comes last will override the other.
   • Which name is in use will be tracked, so if the value is retreived from JavaScript, the prefix is remembered.

2. Properties

   -webkit- prefixed properties are supported through a CSS property aliasing mechanism, and also will obey the following rules.

   • As above, when a -webkit- prefixed property and an -o- prefixed property are encountered, they are treated as instances of the same property, so the latest one (according to usual cascade rules) wins.
   • When accessing or setting the value of a property through JavaScript, all the aliased names of a property are visible as members of the CSSStyleDeclaration object, and they map to the same value.
     • However, the CSSStyleDeclaration .item(*) function will return the canonical name of the alias, not the name actually used. This point may be changed in the future if it is found to cause problems.
   • removeProperty, setProperty, getPropertyValue, and getPropertyPriority all will work with aliases as described above.
   • webkitTransitionEnd is aliased to oTransitionEnd enabling the use of addEventListener("webkitTransitionEnd"...)
     • If both addEventListener("webkitTransitionEnd"...) and addEventListener("oTransitionEnd"...) have been used to register a listener, only the oTransitionEvent will be fired.
   • If the property name is used as the value of another property (as is the case with transition-property), the name that was used is preserved.
   • The properties that have been aliased in this fashion are:

     -o-	-webkit-
     box-shadow	-webkit-box-shadow
     -o-transform	-webkit-transform
     -o-transform-origin	-webkit-transform-origin
     border-radius	-webkit-border-radius
     border-top-left-radius	-webkit-border-top-left-radius
     border-top-right-radius	-webkit-border-top-right-radius
     border-bottom-left-radius	-webkit-border-bottom-left-radius
     border-bottom-right-radius	-webkit-border-bottom-right-radius
     -o-transition	-webkit-transition
     -o-transition-delay	-webkit-transition-delay
     -o-transition-duration	-webkit-transition-duration
     -o-transition-property	-webkit-transition-property
     -o-transition-timing-function	-webkit-transition-timing-function