Future Animations and Units of Measurement

Future Animations and Units of Measurement


So the current coding convention across popular javascript libraries
is to specify animations in terms of total milliseconds, but now that
jquery has gone ahead and included dimensions.js as part of the core,
perhaps its time to revise this concept.
To create consistent animations, with complete control and accuracy,
it would make more sense to use a derived unit, something like pixels
per second, than a unit of time (ms). For two <div> elements to
animate with a consistent speed they have to have similar velocities,
not durations. If for example youre doing any sort of slider,
accordion. This is especially essential for partially animating.
example:
i.e. you are opening a div, and want to close it mid-animation.
currently you would do something like $(this).stop().slideDown('200'),
however because the size of the div thats animating back is unknown it
will seem inconsistently slow or fast compared to the first animation.
To create consistent animations, you have to calculate the total
distance being animated, and then multiply that by some arbitrary unit
of velocity. (pixels per second anyone?).
so lets for example youre starting with a hidden div and animating it
to 500px size, and you want the total duration to be 200 ms.
500px - 0px = 500px (total distance traversed)
0.2 seconds (total animation time)
500 / 0.2 = 2500 pixels per second.
using this derived unit, we can then calculate a consistent speed for
other animating distances, say if we want to close that same DIV while
its currently being animated. To calculate the return time in
millseconds we'd only need two pieces of information
PPS (pixels per second)- determined earlier as a desired 2500 pps,
and
distance of animation in pixels - partially opened div height minus
closed div height
Using a derived unit like PPS, would greatly increase the quality of
animations and the specificity which they could be defined. The only
extra information you need to work with derived units would be the
distance of animations in pixels, delta P, aka $(this).height() before
and after an animation.
I'm not fimiliar enough with jquery's core architecture to suggest an
implementation, but as a jquery developer i was hoping that perhaps
the greater community would have more insight and feedback to the
idea. Inconsistent animations are definitely a pet peeve, and is often
one of the first things IA/UX specialists notice about workign with
jquery and other javascript libraries.
So please let me know what you think about the suggestion, and the
viability of this idea.
-Jack Lukic