javascript - What's jQuery's css syntax for addition and subtraction on numerical values? - Stack Overflow

admin管理员组

文章数量:1022769

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!

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!

• javascript
• jquery
• css

Share Improve this question Follow asked Jul 31, 2010 at 21:36 HubroHubro 59.5k7373 gold badges237237 silver badges402402 bronze badges

Add a ment  | 

1 Answer 1

Sorted by: Reset to default 8

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.

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!

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!

• javascript
• jquery
• css

Share Improve this question Follow asked Jul 31, 2010 at 21:36 HubroHubro 59.5k7373 gold badges237237 silver badges402402 bronze badges

Add a ment  | 

1 Answer 1

Sorted by: Reset to default 8

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.

本文标签： javascriptWhat39s jQuery39s css syntax for addition and subtraction on numerical valuesStack Overflow