Groups | Search | Server Info | Keyboard shortcuts | Login | Register [http] [https] [nntp] [nntps]


Groups > comp.lang.javascript > #28543

Re: Apply a CSS block onresize?

From Thomas 'PointedEars' Lahn <PointedEars@web.de>
Newsgroups comp.lang.javascript
Subject Re: Apply a CSS block onresize?
Date 2015-08-19 18:52 +0200
Organization PointedEars Software (PES)
Message-ID <2216167.0GtFLWOztQ@PointedEars.de> (permalink)
References <mr255d$eff$1@news.albasani.net> <mr27tg$eqr$1@adenine.netfront.net>

Show all headers | View raw


Martin Honnen wrote:

> I would not change the id of the element but its class e.g.

I would not do either in this case.

> […]
>> <body onresize="change_display()">
>>
>> <script>
>> if(d.body.scrollWidth < 800){

You should solve this problem with CSS media queries, not scripting.
 
>   d.write('<div id="menu" class="small">');

Do not do that in any case.

  1. You are generating an incomplete element.  This is error-prone at best.
  2. You are generating an element in a render-blocking fashion.

(2) is acceptable if, and only if, you want to ensure maximum backwards-
compatibility.  That is, below IE/MSHTML 4 and Netscape 6.  (For example, 
I am using document.write() as a fallback in the ECMAScript Support Matrix 
[see sig] if .appendChild() & friends are unavailable.)

>> }
>> else{
> 
>   d.write('<div id="menu" class="big">');

See above.

>> }
>> </script>
>>
>> <h2>My big or small menu</h2>
>> <li><a href="#">Item 1</li>
>> <li><a href="#">Item 2</li>
>> etc.

<http://validator.w3.org/> (HTML < 5, XHTML)
<http://validator.w3.org/nu/> (HTML5)

>> <script>
>> d.write('</div>');

No.

> These days CSS might have more powerful rules that don't depend on
> Javascript to adjust your display to the size of the viewport.

It not only might have them, it does: Media Queries.
 
<https://developer.mozilla.org/en-US/docs/Web/Guide/CSS/Media_queries> pp.

> --- news://freenews.netfront.net/ - complaints: news@netfront.net ---

You should avoid this source of trolls.

-- 
PointedEars
FAQ: <http://PointedEars.de/faq> | SVN: <http://PointedEars.de/wsvn/>
Twitter: @PointedEars2 | ES Matrix: <http://PointedEars.de/es-matrix>
Please do not cc me. / Bitte keine Kopien per E-Mail.

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


Thread

Apply a CSS block onresize? Tuxedo <tuxedo@mailinator.com> - 2015-08-19 16:51 +0200
  Re: Apply a CSS block onresize? Martin Honnen <mahotrash@yahoo.de> - 2015-08-19 17:38 +0200
    Re: Apply a CSS block onresize? Thomas 'PointedEars' Lahn <PointedEars@web.de> - 2015-08-19 18:52 +0200
      Re: Apply a CSS block onresize? Tuxedo <tuxedo@mailinator.com> - 2015-08-19 22:17 +0200

csiph-web