Although transition-property can set different properties separately to operate its gradient, it cannot be used because all you set are transform. Although transition-timing-function can be used to customize special effects with cubic-bezier(), the defined result will also make all changes in the DOM style change at the same time, without giving you before and after effects.
The correct way is to use animation to write animation key frames yourself. For how to write animation key frames, please check: http://imnerd.org/lab/eggpipe.html
Chinese language skills seem to need improvement?
Although transition-property can set different properties separately to operate its gradient, it cannot be used because all you set are
transform
. Although transition-timing-function can be used to customize special effects withcubic-bezier()
, the defined result will also make all changes in the DOM style change at the same time, without giving you before and after effects.The correct way is to use
animation
to write animation key frames yourself. For how to write animation key frames, please check: http://imnerd.org/lab/eggpipe.htmlIf I understand what the poster means, is it necessary for the two attributes to change with two different time functions (or time delays, etc.)? Yes
Hover the example p
http://fiddle.jshell.net/bpw3zx8L/
However, the transform attribute cannot be decomposed, and the action can only be decomposed with the help of keyframe definitions.
You can use scss or less to achieve what you want
Using sass compass and importing libraries can be implemented quickly..
It can solve the compatibility problem..