Groups | Search | Server Info | Keyboard shortcuts | Login | Register [http] [https] [nntp] [nntps]
Groups > comp.lang.javascript > #28644
| Path | csiph.com!au2pb.net!feeder.erje.net!1.eu.feeder.erje.net!weretis.net!feeder1.news.weretis.net!news.solani.org!.POSTED!not-for-mail |
|---|---|
| From | Tuxedo <tuxedo@mailinator.com> |
| Newsgroups | comp.lang.javascript |
| Subject | Setting style with JS including @media statement? |
| Supersedes | <msf1et$bsc$1@solani.org> |
| Date | Sat, 05 Sep 2015 17:48:03 +0200 |
| Organization | solani.org |
| Lines | 25 |
| Message-ID | <msf2sg$gjf$1@solani.org> (permalink) |
| Mime-Version | 1.0 |
| Content-Type | text/plain; charset="ISO-8859-1" |
| Content-Transfer-Encoding | 7Bit |
| X-Trace | solani.org 1441468112 17007 eJwFwYcBwDAIA7CXGDbjHEKa/0+oRA+NTQQDfHyPYJUWIXLzRHft6y+lmIuY+HLUBVmA3OgFuOOMVu3lXVOD1JkwY3rt+qBbvHXM0n8jehvN (5 Sep 2015 15:48:32 GMT) |
| X-Complaints-To | abuse@news.solani.org |
| NNTP-Posting-Date | Sat, 5 Sep 2015 15:48:32 +0000 (UTC) |
| User-Agent | KNode/4.10.5 |
| Cancel-Key | sha1:NSNAISRS7ak7qOPVLVPVb4XzJSw= |
| X-User-ID | eJwFwYkBwCAIA8CVypOo41gg+4/gHYLGWkkwIejMWuU0Rd840nZQx5HjjdrE10Rxm2vub/kAF9AQ6A== |
| Cancel-Lock | sha1:ITJOw7wCVdJRPBazd1UXb0TtbN4= |
| X-NNTP-Posting-Host | eJwNy7kBADEIxMCWzLdAORhD/yXcKZhMJiC0Kwxqa8ubr2+Zv9F3mQdEcNrwG20zd7K5/nDW9NS6Y6KWgk8bvZNXxFby/4IqSwvL3r+CnP4A1GgfFg== |
| Xref | csiph.com comp.lang.javascript:28644 |
Show key headers only | 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
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