Introduction to CSS3 animation and the use of animation library animate.css
in this age, if you don't understand a little CSS3, you are embarrassed to say you are an American worker. Mei Mei, please call me front-end engineer. Uh. All right, the city is zombie. Oh, as a siege corpse, no point in the high-end atmosphere on the grade of what can do, then CSS3 animation is absolutely worth your own, although IE9 and earlier versions of the IE browser do not support CSS3 animation, but the IE6-8 browser is already under the river, using Google browser, Firefox browser, IE10 Liu The number of browsers that support CSS3 animations, such as the browser and mobile end browsers, is increasing, so if it's easy to get some people to get a better user experience, why not.
broadly speaking, CSS3 animation can be divided into two categories.
transition animation
the first kind of animation called transition, which is the animation produced in the process of transition from the initial state to the end state. The so-called state refers to these attributes, such as size, position, color, deformation (transform), and so on. CSS transition can only define the two states of the first and the tail, so it is the simplest animation.
in order to produce transitional animation for an element, we first use the transition attribute to define various parameters of the animation on this element. Defined parameters have
transition-property: specify which attribute to transition
transition-duration: define the transition time, the default is 0
transition-timing-function: define the transition effect of transition animation, such as fade in, fade out, and so on, default is ease
transition-delay: specify transition effect The delay time, that is, after this time, the animation is started, the default is 0
for handwriting, you can also write the four attributes in a transition attribute in the upper order.