Jquery: Can we use variable in css property?

Question

I have a multi language website, I wanna change my container position according to language. For this I have to change its position accordingly I tried below code.

prop = lang == 'ar' ? 'right' : 'left';
$('#head').css({ prop : 200 });

But I am unable to achieve this, when I put static property then its working. I know there are other ways but Is it not possible like this ?

Brian Glaz · Accepted Answer · 2016-08-16 13:30:50Z

3

You can create the object first, and then pass it into the css function.

prop = lang == 'ar' ? 'right' : 'left';
var styles = {};
styles[prop] = 200;
$('#head').css(styles);

answered Aug 16, 2016 at 13:30

Brian Glaz

15.7k4 gold badges40 silver badges55 bronze badges

Sign up to request clarification or add additional context in comments.

6 Comments

Danish Adeel Over a year ago

Thanks, this will work. Will mark it as an answer once it allow me.

gcampbell Over a year ago

For the record, in ES6 you can use computed property names.

iCollect.it Ltd Over a year ago

@DanishAdeel: Sure it works, but why add 2 extra lines of code and the extra complexity when you can just use $('#head').css(prop, "200");? :)

Brian Glaz Over a year ago

@GoneCoding That's fine until you want to set more than one property at a time.

Danish Adeel Over a year ago

@GoneCoding I have just checked your answer which is also solved my problem, I wish I can mark both of you as Correct Answer :)

|

iCollect.it Ltd · Accepted Answer · 2016-08-16 13:30:45Z

2

You are using the version of css that required named properties. Use the other version.

prop = lang == 'ar' ? 'right' : 'left';
$('#head').css(prop, "200");

answered Aug 16, 2016 at 13:30

iCollect.it Ltd

93.9k26 gold badges189 silver badges210 bronze badges

Comments

vijayP · Accepted Answer · 2016-08-16 13:31:19Z

1

Have you tried like below:

var prop = lang == 'ar' ? 'right' : 'left';
var cssObj = {};
cssObj[prop] = 200;
$('#head').css(cssObj);

answered Aug 16, 2016 at 13:31

vijayP

11.5k5 gold badges28 silver badges42 bronze badges

Collectives™ on Stack Overflow

Jquery: Can we use variable in css property?

3 Answers 3

6 Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

6 Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related