Side navigation
#3881 closed bug (fixed)
Opened January 15, 2009 09:36PM UTC
Closed December 05, 2009 05:11AM UTC
Last modified March 14, 2012 01:15PM UTC
some easing throws error in IE or invalid CSS in FF3
| Reported by: | jtnix | Owned by: | |
|---|---|---|---|
| Priority: | minor | Milestone: | 1.4 |
| Component: | effects | Version: | 1.4a1 |
| Keywords: | animate, easing | Cc: | |
| Blocked by: | Blocking: |
Description
If trying to animate an element with very small dimensions or width & height of 0 over a long distance (300+ px) Firebug identifies invalid CSS for width & height (and sometimes top & left, depending on the distance while IE6 javascript throws this error:
Line 4031 of jquery-1.3.js
Invalid Argument
Line 4031: fx.elem.style[ fx.prop ] = fx.now + fx.unit;
Demonstration page: http://nixbox.com/demos/easinganimate.html
This seems to only happen with easing that has a 'backing' effect, like easeInBack or easeInElastic. I assume it is trying to set the properties with negative or invalid values while performing the backing math, since the start size is so small.
At one point I was able to get a full break in Firefox using latest Firebug while testing this problem, but cannot recreate.
No problems in latest Webkit or Safari 3.1.
Attachments (0)
Change History (3)
Changed January 17, 2009 10:40PM UTC by comment:1
| resolution: | → invalid |
|---|---|
| status: | new → closed |
Changed January 18, 2009 06:30AM UTC by comment:2
| resolution: | invalid |
|---|---|
| status: | closed → reopened |
I just checked 1.2.6, and this behavior appears in both versions.
As far as I know, the easing library just does math, no bounds checking on certain properties that I can see was part of the original easing call. Negative values can be useful animating top and left but doesn't play nice with CSS width and height.
here is another test:
<div id="testbox"></div>
<p><a href="#" onclick="$('div#testbox').css({width:-5,height:-5})">set width + height to neg vals via css</a></p>
which you can try here, first link: http://nixbox.com/demos/easinganimate.html
This gives the same CSS parsing error for width and height in firebug and dies in IE with Invalid Argument, except now at line 1050: elem[ name ] = value; ( of jquery-1.3.js)
normally I don't think people would think to set css width/height to neg values, but since some fx math will potentially return negative values as a matter of function, and potentially be applied to a css animation set, and that can makes IE cry, so...
I guess the decision is it worth it to patch just so IE doesn't throw a fit in this off-chance?
Changed December 05, 2009 05:11AM UTC by comment:3
| milestone: | 1.3.1 → 1.4 |
|---|---|
| resolution: | → fixed |
| status: | reopened → closed |
| version: | 1.3 → 1.4a1 |
Are you saying that this exception is new in jQuery 1.3? It sounds like this is a problem with the easing functions themselves. Please re-open if this is a new issue in 1.3.