-webkit-transition-property: translate
-webkit-transform:translate(-320px, 0px);
I have those lines in my css file but this doesn't work in chrome: if I fire up chrome developer tools and inspect css for elements whose style contains those lines i see an hazard icon that tells 'invalid property value'
what happens? is this obsolete?
Definition and Usage. The transition-property property specifies the name of the CSS property the transition effect is for (the transition effect will start when the specified CSS property changes). Tip: A transition effect could typically occur when a user hover over an element.
The Transform property in CSS moves or modifies the appearance of an element, whereas the Transition property seamlessly and gently transitions the element from one state to another. In this blog, we will deep dive into the CSS Transform and Transition properties that will help you in creating simple and cool animations with fewer lines of code.
The <translation-value> CSS data type is used in the arguments for certain transform functions, including translate (), translateX (), translateY (), and translate3d ().
Tip: A transition effect could typically occur when a user hover over an element. Note: Always specify the transition-duration property, otherwise the duration is 0, and the transition will have no effect. The numbers in the table specify the first browser version that fully supports the property.
You need to use the exact css style in the value of transition-property
. So what you would want is:
-webkit-transition-property: -webkit-transform
Whatever the value is needs to be a legit CSS property (exactly). Lemme know if this works! Seems good to me in Chrome.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With