Setting styles dynamically only for @media screen

[C A Upsdell]

I have a site where I am setting a style dynamically, using the JS
statement:

obj.style.backgroundImage = 'url(img/bak_page.jpg)';

where 'obj' is either document.getElementById(id), or document.all[id],
depending on browser support.

This works just fine, with just one small problem: I want to set the style
ONLY for screen media, not for printer media; the above statement appears to
apply the style to all media.

In CSS I have previously set the style for print media using code of the
form:

@media print
{
html#html { background-image:none; }
}

and this works just fine (it prevents printing of a page's background image
when printing) UNLESS I later dynamically change the style using JS.

How can I dynamically change the style only for a specified medium?

[Harlan Messinger]

"C A Upsdell" <cupsdell0311XXX@-@[e-mail]> wrote in message
news:bB*****************@news04.bloor.is.net.cable .rogers.com...

I have a site where I am setting a style dynamically, using the JS
statement:

obj.style.backgroundImage = 'url(img/bak_page.jpg)';

where 'obj' is either document.getElementById(id), or document.all[id],
depending on browser support.

This works just fine, with just one small problem: I want to set the style ONLY for screen media, not for printer media; the above statement appears to apply the style to all media.
Right, you're not changing the rules, you're overriding them by setting a
property directly. You could try to use the CSS-DOM
(http://www.w3.org/TR/DOM-Level-2-Style/) to change the rule for only one
particular medium. Or, if you have an element somewhere that is affected by
a static property that you've made dependent on the medium, you could check
the value of that property to determine what the actual medium is, and
conditionally set the background image based on that.


In CSS I have previously set the style for print media using code of the
form:

@media print
{
html#html { background-image:none; }
}

and this works just fine (it prevents printing of a page's background image when printing) UNLESS I later dynamically change the style using JS.

How can I dynamically change the style only for a specified medium?