apply negative value with variable using .css with jquery

Question

I have a syntax issue as I want to do something quite simple. Apply a negative value to a variable using .css.

Here yo have the code:

var figureImage = $('.js-image-centering');
var figureImageHeight = figureImage.height();
var figureImageWidth = figureImage.width();
var figureImageMarginLeft = (0-(figureImageWidth/2));
var figureImageMarginTop = (0-(figureImageHeight/2));

figureImage.css('margin-left', figureImageMarginLeft);
figureImage.css('margin-top', figureImageMarginTop);

I would like to forget about figureImageMarginLeft and figureImageMarginTop. So, its it possible to something like this?

figureImage.css('margin-left', -figureImageMarginLeft);

How do you write it correctly?

Answer 1

Yes Absolutely. If you do,

var a = 100;
$(".stuff").css("margin-left",-a)

the element would get the rule: margin-left: -100px

Answer 2

What about figureImage.css('margin-left', "-" + figureImageMarginLeft + 'px');?

Answer 3

You can just do this:

var mL = -30;
$("div").css("marginLeft", mL + "px");

Fiddle

Answer 4

That will do the trick (will make positive values negative and negatives positiv):

figureImage.css('margin-left', -figureImageMarginLeft+"px");

or, if you want it to be always negative:

figureImage.css('margin-left', -Math.abs(figureImageMarginLeft)+"px");

always positiv:

figureImage.css('margin-left', Math.abs(figureImageMarginLeft)+"px");

example: http://jsfiddle.net/rN3cw/