What's jQuery's css syntax for addition and subtraction on numerical values?

Question

I'm certain I've seen this before. This is how i remember it

$cnta.css({ top:'+=50' });

Needless to say, it doesn't work :-)

I know i can parse the css value, manipulate the result and put it back into css, but that takes twice the code.

---

Thanks for answers!

Answer 1

That works for .animate():

$cnta.animate({ top:'+=50' }, 0);

For .css(), you can pass a function that will do the addition for you:

$cnta.css('top', function(i,current) { return parseInt(current) + 50; });

$cnta.css('top', function(i,current) { return (parseInt(current) + 50 || 50); });​

---

EDIT: Changed the animation from 1 to 0. As @Nick Craver noted, a 0 animation will work.

EDIT: Gave a better answer for the .css() version. If the top has not been given any value yet, then doing .parseInt(current) will return NaN. Updated to correct it.