Patrioticcow
Patrioticcow

Reputation: 27038

How to add multiple CSS elements to a div using jQuery?

I would like to do this:

<div style="float: left;
            width: 59px;
            background: transparent url('http://download.com/47.jpg') no-repeat scroll -132px -1px;"
     class="cIconSmall">
</div>

and I'm thinking I should use this:

$("#YourElementID").css({
    float: "left",
    width: "59px",
    background: "transparent url('http://download.com/47.jpg') no-repeat scroll -132px -1px"
});

Any ideas?

Thanks

Upvotes: 22

Views: 61538

Answers (3)

T Beatty
T Beatty

Reputation: 11

I found that Andrew Lohr's comment in the accepted solution is for sure the only way I got this to work in my script: $('#selector').css({'property': 'val','property': 'val'}); (and thanks Andrew).

Upvotes: -1

Superman
Superman

Reputation: 39

$(".yourClass").css({
    float: "left",
    width: "59px",
    background: "transparent url('http://download.com/47.jpg') no-repeat scroll -132px -1px"
});

Upvotes: 2

hunter
hunter

Reputation: 63522

You're thinking correctly. Using the css(map) method is the way to go.

$(".cIconSmall").css({
    float: "left", 
    width: "59px", 
    background: "transparent url('http://download.com/47.jpg') no-repeat scroll -132px -1px" 
});

http://api.jquery.com/css/

A map of property-value pairs to set.


Might be nicer as a css class, though... then you can just write $(".cIconSmall").addClass("icon47"); but there's a time for everything...

Upvotes: 48

Related Questions