Opened 9 years ago
Closed 8 years ago
#14484 closed bug (migrated)
Relative percentage values (+= / -=) work in .animate but not in .css
Reported by: | Owned by: | gibson042 | |
---|---|---|---|
Priority: | blocker | Milestone: | 1.12/2.2 |
Component: | css | Version: | 1.10.2 |
Keywords: | Cc: | ||
Blocked by: | Blocking: |
Description
.css({'left':'+=50%'})
...moves the item by 50 pixel instead of 50%, while
.animate({'left':'+=50%'})
...works as expected (adds 50%).
The docs suggest that .css and .animate should behave identically (http://api.jquery.com/css/):
As of jQuery 1.6, .css() accepts relative values similar to .animate().
If "similar" should really mean "similar" but not identical, it would help to give a hint in the docs that relative percentage values are not supported by .css.
The problem shows up in current Chrome, Firefox and IE10.
Fiddle to reproduce: http://jsfiddle.net/2VGgg/
Change History (7)
comment:1 Changed 9 years ago by
Component: | unfiled → css |
---|---|
Milestone: | None → 1.11/2.1 |
Priority: | undecided → blocker |
Status: | new → open |
comment:2 Changed 9 years ago by
Replying to [email protected]…:
.css({'left':'+=50%'})
The problem is that style function that is called by css function doesn't care about percentage. A fix could be by adding support for this by checking if there is the % symbol at the end of value. If so it should compute the percentage of the parent width. I fixed the bug with something
if ( type === "string" && (ret = rrelNum.exec( value )) ) { // Fixes bug #14484 if(!/[%$]/i.exec(value) ) { value = (( ret[1] + 1 ) * ret[2]) + parseFloat( jQuery.css( elem, name ) ); } else { value = parseFloat( jQuery.css( elem, name ) ) + (parseFloat(jQuery(elem).parent().css("width")) * (( ret[1] + 1 ) * ret[2]/100)); } // Fixes bug #9237 type = "number"; }
Thanks. Franco
comment:3 Changed 9 years ago by
Owner: | set to gibson042 |
---|---|
Status: | open → assigned |
comment:4 Changed 9 years ago by
Milestone: | 1.11/2.1 → 1.11.1/2.1.1 |
---|
comment:5 Changed 9 years ago by
This is reproducible for other unit "em"
There are other not so popular units like "cm","in" etc.
Need fix for them too
comment:6 Changed 9 years ago by
Milestone: | 1.11.1/2.1.1 → 1.12/2.2 |
---|
comment:7 Changed 8 years ago by
Resolution: | → migrated |
---|---|
Status: | assigned → closed |
Migrated to https://github.com/jquery/jquery/issues/1711
This looks valid.