Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Applying more CSS properties within one line

Tags:

jquery

css

Is there any possible way to apply more than CSS to a control through a single line of code.In below example i could i apply only one property

$('#<%=lblMessage.ClientID%>').css("color", "#16428b");

Suppose if i would like to apply font or background.. how it is possible

-Thanks

like image 203
user182401 Avatar asked Oct 27 '09 14:10

user182401


2 Answers

.css({
    color: "#16428b",
    backgroundColor: "#f0f",
    "font-size" : "3em"
})

note the different styles of defining the CSS rules: camelCase for javascript, "css-style" for quoted strings.

This is also much more efficient than multiple chains of successive .css() calls, since it doesn't require multiple passes through your jQuery object.

like image 54
nickf Avatar answered Sep 26 '22 18:09

nickf


You just chain them:

$('#<%=lblMessage.ClientID%>')
   .css("color", "#16428b")
   .css("font-family", "Helvetica, Arial, sans-serif")
   .css("background", "#ccc");

Most methods in the jQuery object returns the jQuery object itself, so you just apply another method to the return value.

Edit:
If it's efficiency you are looking for it's of course best to update the element style directly:

var e = document.getElementById('<%=lblMessage.ClientID%>');
e.style.color = '#16428b';
e.style.fontFamily = 'Helvetica, Arial, sans-serif';
e.style.backgroundColor = '#ccc';
like image 30
Guffa Avatar answered Sep 23 '22 18:09

Guffa