I need to change more than one style attribute for a given element. I know how to change one: document.getElementById(today).style.visibility= "visible";
but am unsure of the syntax for changing more than one e.g. visibility,width, height and font-color.
views:
176answers:
4
+1
A:
You need to reference each attribute one at a time, i.e. .style.width=, .style.height=, etc.
You could shorten the amount of typing you do a bit like so:
var g = document.getElementById(today);
g.style.width=100;
g.style.height=100;
g.style.visibility='visible';
Michael Todd
2009-11-19 03:18:23
Thanks for this Michael I will give it a go.
Dave
2009-11-19 03:32:45
+1
A:
It's just multiple calls:
document.getElementById(today).style.visibility = "visible";
document.getElementById(today).style.color = "red";
document.getElementById(today).style.height = "5em";
Wevah
2009-11-19 03:19:50
Awesome thanks. Next trick is one of the attributes that I am changing is font-size but it doesn't seem to like the "-" in document.getElementById(today).style.font-size= "x-small";
Dave
2009-11-19 03:32:12
@Dave, for CSS properties that have contain dashes, you have to remove the dash, and uppercase the next character, i.e.: for `font-size`, you should use `fontSize`.
CMS
2009-11-19 03:54:48
+1
A:
CSS way would be to create a class that does all the styling common to those elements and assign the class attribute to them,
alternatively, if they are inhertiable styles then put the elements in a common parent say div and set the div's style
Murali
2009-11-19 03:21:19
+1
A:
If you are willing to replace any other inline styles for that element you can use the style.cssText property.
document.getElementById('idstring').style.cssText=
'font-size:1em;color:blue;visibility:visible';
kennebec
2009-11-19 05:00:40