jQuery (basic syntax question): modifying several parameters with one .css

Question

This is probably too basic but I'm unable to figure out how this is done.

To modify one CSS property of a div, I do this:

$('#myDiv').css('width', '300');

What if I want to modify both width and height?

This --

$('#myDiv').css('width', '300', 'height', '250');

-- didn't work.

Chaining it works:

$('#myDiv').css('width', '300').css('height', '250');

-- but I'm wondering if there's more elegant, simpler syntax for it. Would be grateful for someone's advice.

Claudio Redi · Accepted Answer · 2011-07-19 01:51:13Z

5

Try this

$('#myDiv').css({width: '300', height: '250'});

From official documentation

jQuery can equally interpret the CSS and DOM formatting of multiple-word properties. For example, jQuery understands and returns the correct value for both .css({'background-color': '#ffe', 'border-left': '5px solid #ccc'}) and .css({backgroundColor: '#ffe', borderLeft: '5px solid #ccc'}). Notice that with the DOM notation, quotation marks around the property names are optional, but with CSS notation they're required due to the hyphen in the name.

edited Jul 19, 2011 at 1:51

answered Jul 19, 2011 at 1:45

Claudio Redi

68.6k15 gold badges138 silver badges161 bronze badges

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

3 Comments

Dimitri Vorontzov Over a year ago

Thank you, Claudio. Tried it. Didn't work. Are there any other ways?

hunter Over a year ago

should be $('#myDiv').css({width: '300', height: '250'});. Notice the : instead of the ,

Dimitri Vorontzov Over a year ago

Great! Thanks Claudio, Thanks Hunter!

Collectives™ on Stack Overflow

jQuery (basic syntax question): modifying several parameters with one .css

1 Answer 1

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related