These include ease, linear, ease-in, ease-out, and ease-in-out as well as the ability to create your own with cubic-bezier. webkit-transition-timing-function: There are a number of timing functions-mathematical models for how the transition takes place-that you can choose from. This is specified in seconds: 1s, 0.5s, etc. webkit-transition-duration: The amount of time from the beginning of the transition to the end. If it is set to all every available property will be animated, otherwise you can choose to animate one or more individual properties and leave the rest as they are. webkit-transition-property: This specifies which properties of the element will be animated. Additionally, there is a shorthand property that combines the three: -webkit-transition. There are three properties that make up the transition: -webkit-transition-property, -webkit-transition-duration, and -webkit-transition-timing-function. CSS Transitions are a very powerful effect that can eliminate the use of JavaScript for many common effects. Newer versions of Apple's Safari web browser (and Google Chrome, which is also based on Webkit) support a vendor-specific implementation of the CSS3 Transition property.
Update: MaWe have an updated post after years of practice with these techniques.
0 kommentar(er)
