Shulou(Shulou.com)06/01 Report--

This article mainly introduces "how to achieve html5 ease effect". In daily operation, I believe many people have doubts about how to achieve html5 ease effect. The editor consulted all kinds of materials and sorted out simple and easy-to-use operation methods. I hope it will be helpful for you to answer the doubts about "how to achieve html5 ease effect". Next, please follow the editor to study!

Ease type:

Linear: no moderation effect

Quadratic: ease of quadratic power (t ^ 2)

Cubic: the ease of the cubic power (t ^ 3)

Quartic: the ease of the fourth power (t ^ 4)

Quintic: the ease of the fifth power (t ^ 5)

Sinusoidal: ease of sine curve (sin (t))

Exponential: ease of exponential curve (2 ^ t)

Circular: ease of circular curves (sqrt (1-t ^ 2))

Elastic: sinusoidal relaxation with exponential decay

Cubic retardation beyond the range ((slugg1) t ^ 3-st ^ 2)

Rebound retardation of exponential decay

There are three ways to ease each type:

EaseIn: slow first and then fast

EaseOut: first fast and then slow

EaseInOut: first slow, then fast, then slow

Encapsulated ease function:

/ / Tween.js

/ / t: current time (current time)

/ / b: beginning value (initial value)

/ / c: change in value (variation)

/ / d: duration (duration).

/ / you can visit''to get effect

Var Tween = {

Linear: function (t, b, c, d) {return c*t/d + b;}

Quad: {

EaseIn: function (t, b, c, d) {

Return c * (t / = d) * t + b

}

EaseOut: function (t, b, c, d) {

Return-c * (t / = d) * (tmer2) + b

}

EaseInOut: function (t, b, c, d) {

If ((t / = d / 2) < 1) return c / 2 * t * t + b

Return-c / 2 * ((--t) * (tMel 2)-1) + b

}

}

At this point, the study on "how to achieve the slow effect of html5" is over. I hope to be able to solve your doubts. The collocation of theory and practice can better help you learn, go and try it! If you want to continue to learn more related knowledge, please continue to follow the website, the editor will continue to work hard to bring you more practical articles!

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.