default style.backgroundColor value

[Philip]

Hey,

Is it possible to get the default value of an element's
style.backgroun dColor property that's set in a css class?

Example, since I'm very tired and can't word that any better ;)

input.example { background-color: #fff }

and the javascript:
var original = document.formna me.example.styl e.backgroundCol or;

returns null. Any ideas?

I should stress at this point any hard coded colours are not an option,
since the site is themeable and I don't want to introduce any conflicts.

Thanks in advance.

--
Philip
email-o-mask-o: spam->mouse

[DU]

Re: default style.backgroun dColor value

Philip wrote:[color=blue]
> Hey,
>
> Is it possible to get the default value of an element's
> style.backgroun dColor property that's set in a css class?
>
> Example, since I'm very tired and can't word that any better ;)
>
> input.example { background-color: #fff }
>[/color]

You need to know which styleSheets it involves in the ordered collection
of style sheets and which cssRules is involved in the cssRules list.

http://www.w3.org/TR/2000/REC-DOM-Level-2-Style-20001113/stylesheets.html#StyleSheets-DocumentStyle-styleSheets

http://www.w3.org/TR/2000/REC-DOM-Level-2-Style-20001113/css.html#CSS-CSSStyleSheet-cssRules

[color=blue]
> and the javascript:
> var original = document.formna me.example.styl e.backgroundCol or;
>[/color]

example is a className while formname is presumably the form's name. The
2 refer to 2 different and incompatible interfaces.
[color=blue]
> returns null. Any ideas?
>[/color]

Assuming the following is your stylesheet (and you only have 1 style sheet):

<style type="text/css">
body {margin:16px; padding:0px; color:black; background-color:white;}
input.example { background-color: #fff }
p#footer img , p#validation img {margin:0 0.5em;}
p#validation img {width:88px; height:31px;}
</style>

then
alert("document .styleSheets[0].cssRules[1].style.backgrou ndColor = " +
document.styleS heets[0].cssRules[1].style.backgrou ndColor);
should return/output #fff in DOM 2 CSS compliant browsers. For MSIE 5+,
then use rules instead.
E.g.: show the height value in the last rule:

var heightStyleValu e = "unable to process";
if("cssRules" in document.styleS heets[0]) // DOM 2 CSS compliant browsers
{
var heightStyleValu e = document.styleS heets[0].cssRules[3].style.height;
}
else if("rules" in document.styleS heets[0]) // MSIE 5+
{
var heightStyleValu e = document.styleS heets[0].rules[3].style.height;
};

alert(heightSty leValue);
should alert "31px".
[color=blue]
> I should stress at this point any hard coded colours are not an option,
> since the site is themeable and I don't want to introduce any conflicts.
>
> Thanks in advance.
>[/color]

DU
--
Javascript and Browser bugs:

http://www10.brinkster.com/doctorunclear/

- Resources, help and tips for Netscape 7.x users and Composer
- Interactive demos on Popup windows, music (audio/midi) in Netscape 7.x

http://www10.brinkster.com/doctorunclear/Netscape7/Netscape7Section.html