Ease equations witout Tweens Engine
make use of Quad , cubic, quart, and lastly (Quint/Strong) easeIn/easeOut formulas. This was for me to wrap my head around how these equations work without Tweening Engines.
by fezec
HTML
<input type="number" value=0>
<input type="submit" value="Submit">
JavaScript
var totalTime = 20;
var currentTime = 10;
var startPosition = 0;
var endPosition = 100;
var deviation = endPosition - startPosition;
function noEasing(currentDuration, startValue, toDeviateFromStart, ofDuration) {
return toDeviateFromStart * currentDuration / ofDuration + startValue
}
alert("no ease: " + Number(noEasing(currentTime, 0, 1, totalTime) * deviation + (startPosition)));
alert("quad easeIN: " + Number(Math.pow(noEasing(currentTime, 0, 1, totalTime), 2) * deviation + (startPosition)));
alert("quad easeOut: "+Number((1-(Math.pow(1-noEasing(currentTime, 0, 1, totalTime), 2)))* deviation + (startPosition)));