Questions tagged [easing-functions]

...functions attributed to Robert Penner for moving objects smoothly from one on-screen position to another with the illusion of smooth acceleration, deceleration and mass.

Easing is an important topic for anyone who wants to define a point on a computer screen and move an object smoothly to that point in fixed timeframe. Easing functions involve distance and time. Penner style easing functions are called with a value for the current time elapsed (since the start of easing), the current position of the object to be eased, the difference between the destination point and the current position, and the length of time allotted for the completion of the easing. Easing functions are the most commonly encountered and these are functions attributed to Robert Penner for moving objects smoothly from one on-screen position to another with the illusion of smooth acceleration, deceleration and mass. The original Penner equations can be found here:

Penner Easing

Some interesting websites explore easing functions in more depth:

Gizma's Easing Equations

Upshots.org "Understanding Easing"

Tim Groleau's Easing Function Generator

69 questions
0
votes
1 answer

How to convert Greensock's CustomEase functions to be usable in CreateJS's Tween system?

I'm currently working on a project that does not include GSAP (Greensock's JS Tweening library), but since it's super easy to create your own Custom Easing functions with it's visual editor - I was wondering if there is a way to break down the…
chamberlainpi
  • 4,854
  • 8
  • 32
  • 63
0
votes
1 answer

Easing functions for my animation not working

I'm not the best at maths, and im sorta trying to guess how to implement this for my animation. But currently it is not working, and I believe i have misunderstood how to do my easing function for my animation. I have a object which is meant to…
Sir
  • 8,135
  • 17
  • 83
  • 146
0
votes
1 answer

Tone down jQuery Easing's bounce

I'm using the jQuery Easing plugin and using the bounce easing effect. I like it, but it's so incredibly drastic. I need to tone it down (probably removing a bounce and making the curves less drastic. I've found this post, but I'm actually not a…
Joel Worsham
  • 1,140
  • 1
  • 7
  • 19
0
votes
1 answer

Usage of SCNActionTimingModeEaseInEaseOut

For an instance of SCNAction, we can specify the property timingMode. We can specify this as SCNActionTimingModeEaseInEaseOut. It doesn't seem that this is enough, in order for this to work we must also specify timingFunction (right?). How would…
Jonny
  • 15,955
  • 18
  • 111
  • 232
0
votes
1 answer

Bouncing Ease Equation in C#

I'm trying to add a bounce effect to an element of a game I'm making using C#. I can't seem to find the correct easing equation for this. Here's what I'm using for the time being: t.position += (destination-t.position)*0.05f; …
Sonofblip
  • 1,167
  • 3
  • 12
  • 20
0
votes
1 answer

what is the duration of easing functions

I am trying to implement some of the easing functions but I am not sure where the duration comes from? Is it something that the user inputs or can it be computed? Does it depend on the start and end values?
AleC
  • 579
  • 3
  • 7
  • 15
0
votes
1 answer

Easing effect for animating postion change

I use this line of code for changing the position of an ul to get the requested li in focus. $('ul#scroll').stop().animate({'left': new_pos+'px'}, {duration: 50, easing: "swing"}); I tried some Effects like smoothmove but I get an error, that…
user998163
  • 471
  • 1
  • 9
  • 28
0
votes
1 answer

easeOutInQuad returns error "easeOutQuad" is undefined

I have a jQuery animation which slows down too much at the end using the default swing easing. I tried the linear option but it looked similarly slow near the end. I went through and tried several of the easing functions found here. Because I have…
Brad W
  • 2,540
  • 2
  • 18
  • 28
0
votes
1 answer

preventing out of bounds values in penner easing

I'm working on a project that uses the following easing function to move objects on the screen: function easeinoutquart(t,b,c,d) as float 't=time, b=startvalue, c=change in value, d=duration d=d/2 t=t/d if (t < 1) then …
alphablender
  • 2,168
  • 5
  • 27
  • 42
1 2 3 4
5