Side navigation
#10021 closed bug (fixed)
Opened August 11, 2011 04:13AM UTC
Closed August 25, 2011 07:23PM UTC
Last modified August 26, 2011 02:45PM UTC
Can't add negative numbers using the relative-value syntax with .css() and .animate()
Reported by: | mtaby@me.com | Owned by: | dmethvin |
---|---|---|---|
Priority: | low | Milestone: | 1.6.3 |
Component: | css | Version: | 1.6.2 |
Keywords: | Cc: | ||
Blocked by: | Blocking: |
Description
When I use the relative-value syntax in my .css() and .animate(), I can't add negative numbers like so:
$('#foo').css('margin-left','+=-1')
This comes up when you're building up the value using string concatenation and you don't know whether the value is positive of negative:
$('#foo').css('margin-left','+='+value)
Here's a jsFiddle which highlights the problem:
Attachments (0)
Change History (7)
Changed August 16, 2011 05:42AM UTC by comment:1
component: | unfiled → css |
---|---|
priority: | undecided → low |
resolution: | → wontfix |
status: | new → closed |
Changed August 16, 2011 05:46AM UTC by comment:2
You're right, nobody would write out +=-1 by hand, but my point is, users shouldn't have to write out the tertiary operator by hand when what they're trying to say is perfectly valid. That kind of conditional code is messy and annoying to write. Besides, adding a negative number is a valid mathematical expression :)
Changed August 16, 2011 07:29PM UTC by comment:3
resolution: | wontfix |
---|---|
status: | closed → reopened |
I think this may be a very easy fix, just add the minus sign to the rfxnum regexp in effects.js. The code in css.js needs a bit more tweaking to code but it shouldn't be much.
Changed August 16, 2011 07:30PM UTC by comment:4
milestone: | None → 1.6.3 |
---|---|
owner: | → dmethvin |
status: | reopened → assigned |
Changed August 16, 2011 09:55PM UTC by comment:5
Animation already works, css does not.
Thanks for submitting a ticket to the jQuery bug tracker. I've never actually seen anyone use relative-value syntax in the way described for negative numbers (ie. +=-1).
Why not simply use the (more common) negative equivalent of +=1 (ie. -=1?). http://jsfiddle.net/F7Ybw/4/. If there is an uncertainty about where the value used in your string concatenation example is positive or negative, there are many ways you can use to test this.
For example, if the value passed is a string (with or without units) var myOperator = (parseInt(value) <0)? '-=' : '+='; would allow you to get the correct operator to use and you can then simply use $('#foo').css('margin-left', myOperator +value); as per your example.