Setting style with JS including @media statement?

From	Tuxedo <tuxedo@mailinator.com>
Newsgroups	comp.lang.javascript
Subject	Setting style with JS including @media statement?
Date	2015-09-05 17:48 +0200
Organization	solani.org
Message-ID	<msf2sg$gjf$1@solani.org> (permalink)

Show all headers | View raw

Hello,

Using CSS @media queries rather than conditional JS-CSS style 
modification if matching some body.scrollWidth statement, styling for 
different screens is much simplified. For example:

@media (max-width: 300px){
#my_menu{
backgroundImage='url(small.png')';
}
}

But there are still situations where it may be necessary to dynamically 
change styles to elements via JS. Normally I would do:
document.getElementById("my_menu").style.backgroundImage='url(another.png)';

In combination with media queries, however, the above also changes style 
properties relating to any media queries above 300 pixels, which I don't 
want it to. As such, is it possible to change #my_menu element including the 
CSS @media condition so that the @media (max-width: 300px) is properly 
expressed and applied to the document via Javascript? If so, how can this be 
done?

Many thanks,
Tuxedo

Back to comp.lang.javascript | Previous | Next — Next in thread | Find similar | Unroll thread

Thread

Setting style with JS including @media statement? Tuxedo <tuxedo@mailinator.com> - 2015-09-05 17:48 +0200
  Re: Setting style with JS including @media statement? "Evertjan." <exxjxw.hannivoort@inter.nl.net> - 2015-09-05 23:04 +0200
    Re: Setting style with JS including @media statement? "Evertjan." <exxjxw.hannivoort@inter.nl.net> - 2015-09-05 23:33 +0200

csiph-web