Side navigation
#928 closed enhancement (fixed)
Opened February 07, 2007 08:25PM UTC
Closed March 24, 2007 03:12AM UTC
Cleanup the built-in "easing" stuff
| Reported by: | rse@engelschall.com | Owned by: | |
|---|---|---|---|
| Priority: | minor | Milestone: | 1.1.3 |
| Component: | effects | Version: | 1.1 |
| Keywords: | easing linear | Cc: | |
| Blocked by: | Blocking: |
Description
The documentation says that jQuery by default uses a "linear" easing. That's not correct, it by default uses some sort of a "swing" easing based on a trigonometric calculation (which progresses slowly first, then accellerates and then slows down at the end again). Additionally, there is no "linear" easing defined at all in jQuery.easing. Instead the wrong "linear" easing (which is actually the mentioned "swing" easing) is hard-coded and this way not even can be replaced by a plugin. IMHO the hard-coded value should be moved as a definition into jQuery.easing and it also should be not named "linear" but something different. Additionally, the long documented "linear" easing also should be finally provided by default, too. I've prepared a patch against the current jQuery SVN trunk which I'll try to append to this ticket.
Attachments (3)
Change History (4)
Changed February 07, 2007 08:30PM UTC by comment:1
Changed February 08, 2007 01:24AM UTC by comment:2
| component: | ajax → fx |
|---|
Could you paste the patch in a comment here please. Wrap the code with {{{ brackets.
Changed February 09, 2007 07:34AM UTC by comment:3
Here is the patch copy & pasted, but keep in mind that it contains tabs so
it will not cleanly apply automatically. I though the file attachment feature worked....
Index: jquery/src/fx/fx.js
===================================================================
--- jquery/src/fx/fx.js (revision 1304)
+++ jquery/src/fx/fx.js (working copy)
@@ -301,7 +301,7 @@
* @example $("p").animate({
* opacity: 'show'
* }, "slow", "easein");
- * @desc An example of using an 'easing' function to provide a different style of animation. This will only work if you have a plugin that pr
+ * @desc An example of using an 'easing' function to provide a different style of animation. This will only work if you have a plugin that pr
*
* @name animate
* @type jQuery
@@ -379,7 +379,14 @@
return opt;
},
- easing: {},
+ easing: {
+ linear: function(percentage_elapsed, time_elapsed, value_start, value_difference, time_duration) {
+ return value_start + value_difference * percentage_elapsed;
+ }
+ swing: function(percentage_elapsed, time_elapsed, value_start, value_difference, time_duration) {
+ return value_start + value_difference * ((- Math.cos(percentage_elapsed * Math.PI) / 2) + 0.5);
+ }
+ },
queue: {},
@@ -558,8 +565,7 @@
// If the easing function exists, then use it
z.now = options.easing && jQuery.easing[options.easing] ?
jQuery.easing[options.easing](p, n, firstNum, (lastNum-firstNum), options.duration) :
- // else use default linear easing
- ((-Math.cos(p*Math.PI)/2) + 0.5) * (lastNum-firstNum) + firstNum;
+ jQuery.easing["swing"](p, n, firstNum, (lastNum-firstNum), options.duration);
// Perform the next step of the animation
z.a();
Changed March 24, 2007 03:12AM UTC by comment:4
| resolution: | → fixed |
|---|---|
| status: | new → closed |
| type: | bug → enhancement |
Fixed in SVN rev [1575].
BTW, you'll notice that I've used the "swing" easing as the default in my patch to make the _CODE_ still be 100% backward compatible. But then the docs should not mentioned that jQuery uses "linear". Or the docs can be kept as is and the default should be the "linear" easing. I personally think "linear" should be the default as mentioned, even if it isn't such "nice". But as a default it is fine. And please feel free to come up with a better name instead of "swing" in case you find "swing" not be good enough.