Side navigation
#4966 closed bug (fixed)
Opened July 24, 2009 03:21PM UTC
Closed February 13, 2011 10:19PM UTC
Last modified March 09, 2012 07:54AM UTC
Problem with animate and zIndex
| Reported by: | gdripoll | Owned by: | jitter |
|---|---|---|---|
| Priority: | low | Milestone: | 1.5.1 |
| Component: | effects | Version: | 1.5 |
| Keywords: | problem animate zindex | Cc: | |
| Blocked by: | Blocking: |
Description
There's a problem width animate and zIndex in IE8 (didn't check previous versions yet, but Firefox and Chrome doesn't seem to have the problem).
I followed the problem upto line 4166 in Developer version:
>> fx.elem.style[ fx.prop ] = fx.now + fx.unit;
Apparently, it tries to append 'px' in the case of zIndex, which is erroneous.
I temporaly patched it to:
>> fx.elem.style[ fx.prop ] = fx.now + ((fx.prop!="zIndex")?fx.unit:"");
and it works.
Shure not the best solution.
Attachments (0)
Change History (9)
Changed October 21, 2010 08:05PM UTC by comment:1
| component: | core → effects |
|---|---|
| keywords: | → problem animate zindex |
| owner: | → gdripoll |
| priority: | major → low |
| status: | new → pending |
Changed November 11, 2010 11:09PM UTC by comment:2
| status: | pending → closed |
|---|
Automatically closed due to 14 days of inactivity.
Changed February 07, 2011 01:18AM UTC by comment:4
| milestone: | 1.4 → 1.next |
|---|---|
| status: | closed → reopened |
| version: | 1.3.2 → 1.5 |
Changed February 07, 2011 01:20AM UTC by comment:5
Just as a note: only IE browsers have a problem with "z-index: 0px" (or any value other than 0, as long as it has the "px" suffix). Other browsers ignore the unit and reduce it to an integer. Whether that’s to spec or not is debatable, but it doesn’t make sense for a library to explicitly specify it. :-)
Changed February 07, 2011 01:53AM UTC by comment:6
| owner: | gdripoll → jitter |
|---|---|
| status: | reopened → assigned |
This actually fails in all browsers for me. Reason is that it ends up settings things like 8.816275116495891px which is wrong in two ways:
a. It's not an integer like the value for z-index should be
b. the unit "px" is appended.
Internally we already have the cssNumber object which holds properties that have no unit.
There probably are several valid approaches to this that come to mind (use the cssNumber object somehow, change the usage of the rfxnum results, include special fx.step functions for all the numeric-no-unit properties?)
Which one is the most appropriate one remains to be evaluated.
I imagine a possible fix could be to change this line in animate
unit = parts[3] || "px"
to something like this
unit = parts[3] || jQuery.cssNumber[ name ] ? "" : "px"
Replying to [comment:16 KuraFire]:
Just as a note: only IE browsers have a problem with "z-index: 0px" (or any value other than 0, as long as it has the "px" suffix). Other browsers ignore the unit and reduce it to an integer. Whether that’s to spec or not is debatable, but it doesn’t make sense for a library to explicitly specify it. :-)
I can't seem to reproduce that "reduce to integer" behavior, but I saw that you included some Math.round/Math.floor code in your plugin.
Btw. my test case includes a - commented out - workaround that should work until this is fixed in jQuery core.
Changed February 13, 2011 10:19PM UTC by comment:7
| resolution: | → fixed |
|---|---|
| status: | assigned → closed |
Don't add "px" to unit-less properties when animating them. Fixes #4966.
Changeset: c5edf982d59977c506fececd504a3dbfd1a398dc
Changed February 13, 2011 10:20PM UTC by comment:8
| milestone: | 1.next → 1.5.1 |
|---|
Changed May 10, 2011 10:50PM UTC by comment:9
While this fixes the z-index bug, it also breaks old code written based on what the animate() documentation says: "Property values are treated as a number of pixels unless otherwise specified."
Instead of not adding 'px' at all, is there a way to instead have a list of specific properties that won't get 'px' appended? It's a minor pain to have to manually concatenate 'px' to every number used with the animate().
Please submit a test case that reproduces this issue so that we can investigate it more thoroughly.