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


Groups > comp.lang.javascript > #26050

Re: DOM styling modified by <body onload=> JavaScript does not affect first rendering

From "Chris Beall" <Chris_Beall@prodigy.net>
Newsgroups comp.lang.javascript
Subject Re: DOM styling modified by <body onload=> JavaScript does not affect first rendering
Date 2014-10-30 15:46 -0400
Organization A noiseless patient Spider
Message-ID <op.xoj6jrdgtnmj2w@cbealls-imac.local> (permalink)
References <op.xognrthttnmj2w@cbealls-imac.local> <0Qpl$Ta+fVUUFw8H@invalid.uk.co.demon.merlyn.invalid>

Show all headers | View raw


Dr J R Stockton wrote:

> In comp.lang.javascript message <op.xognrthttnmj2w@cbealls-imac.local>,
> Tue, 28 Oct 2014 18:08:07, Chris Beall <Chris_Beall@prodigy.net> posted:
>
>> (If this is too far off-topic for this group, please suggest another)
>>
>> Testcase: http://beallsprings.org/sandbox/Mod%20DOM%20test.html
>>
>> Observation: Of the tested browsers, only Firefox renders the page
>> AFTER  applying the style modifications (which is what I wanted).
>>
>> Question: Is there a way to make this work on all modern browsers?  How
>> about an easy way?  Or is it a rather widespread bug?

> What happens if you put something *like*
>
> <body style="display:none;"
>   onload='document.body.style="display:block;"'>
>
> and then, instead of using onload, do that statement when your
> modifications are completed?
>

Looking much better.  See  
http://beallsprings.org/sandbox/Mod%20DOM%20test3.html (version 2 blew up  
on the launch pad...)
Leaving my modification code in a function, I used:

<body style="display:none;"
   onload='animInit();document.body.style.display="block"'>

combining Dr. S's suggestion and Evertjan.'s correct syntax with an  
invocation of the function

Which works on Firefox (15 seconds), Safari (12 seconds), Chrome (12  
seconds), and IE (15 seconds).  Opera duration stays at 1 second, but  
inspection with Dragonfly shows that both the Style and Computed style  
reflect a change to animation-duration (no prefix) to 15 seconds.  So the  
change takes place, but the rendering engine uses only the unmodified  
value.

Incidentally, Safari and Chrome both ignored animation-timing-function,  
instead using the default 'ease'.  Adding  
-webkit-animation-timing-function: linear; brought them to heel.

As it turns out, the particular target audience for my original effect  
does not use Opera, so for me this issue is resolved, although the  
solution is clearly not yet a completely generic fix.

Now to integrate what I've learned into the actual web page.

Thanks to all,
   Chris Beall

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


Thread

DOM styling modified by <body onload=> JavaScript does not affect first rendering "Chris Beall" <Chris_Beall@prodigy.net> - 2014-10-28 18:08 -0400
  Re: DOM styling modified by <body onload=> JavaScript does not affect first rendering BootNic <bootnic.bounce@gmail.com> - 2014-10-29 00:26 -0400
  Re: DOM styling modified by <body onload=> JavaScript does not affect first rendering John Harris <niam@jghnorth.org.uk.invalid> - 2014-10-29 15:33 +0000
  Re: DOM styling modified by <body onload=> JavaScript does not affect first rendering Dr J R Stockton <reply1400@merlyn.demon.co.uk.invalid> - 2014-10-29 21:11 +0000
    Re: DOM styling modified by <body onload=> JavaScript does not affect first rendering "Evertjan." <exxjxw.hannivoort@inter.nl.net> - 2014-10-30 10:12 +0100
      Re: DOM styling modified by <body onload=> JavaScript does not affect first rendering Dr J R Stockton <reply1400@merlyn.demon.co.uk.invalid> - 2014-10-31 20:45 +0000
        Re: DOM styling modified by <body onload=> JavaScript does not affect first rendering "Evertjan." <exxjxw.hannivoort@inter.nl.net> - 2014-11-01 10:12 +0100
          Re: DOM styling modified by <body onload=> JavaScript does not affect first rendering Tim Streater <timstreater@greenbee.net> - 2014-11-01 10:19 +0000
            Re: DOM styling modified by <body onload=> JavaScript does not affect first rendering "Evertjan." <exxjxw.hannivoort@inter.nl.net> - 2014-11-01 12:22 +0100
            Re: DOM styling modified by <body onload=> JavaScript does not affect first rendering Thomas 'PointedEars' Lahn <PointedEars@web.de> - 2014-11-01 15:22 +0100
          Re: DOM styling modified by <body onload=> JavaScript does not affect first rendering "Christoph M. Becker" <cmbecker69@arcor.de> - 2014-11-01 11:32 +0100
            Re: DOM styling modified by <body onload=> JavaScript does not affect first rendering "Evertjan." <exxjxw.hannivoort@inter.nl.net> - 2014-11-01 12:25 +0100
            Re: DOM styling modified by <body onload=> JavaScript does not affect first rendering Thomas 'PointedEars' Lahn <PointedEars@web.de> - 2014-11-01 15:23 +0100
              Re: DOM styling modified by <body onload=> JavaScript does not affect first rendering "Christoph M. Becker" <cmbecker69@arcor.de> - 2014-11-01 16:50 +0100
                Re: DOM styling modified by <body onload=> JavaScript does not affect first rendering Thomas 'PointedEars' Lahn <PointedEars@web.de> - 2014-11-01 20:40 +0100
                Re: DOM styling modified by <body onload=> JavaScript does not affect first rendering "Christoph M. Becker" <cmbecker69@arcor.de> - 2014-11-02 20:55 +0100
                Re: DOM styling modified by <body onload=> JavaScript does not affect first rendering Thomas 'PointedEars' Lahn <PointedEars@web.de> - 2014-11-29 19:27 +0100
    Re: DOM styling modified by <body onload=> JavaScript does not affect first rendering "Chris Beall" <Chris_Beall@prodigy.net> - 2014-10-30 15:46 -0400
  Re: DOM styling modified by <body onload=> JavaScript does not affect first rendering "Christoph M. Becker" <cmbecker69@arcor.de> - 2014-10-31 12:52 +0100
    Re: DOM styling modified by <body onload=> JavaScript does not affect first rendering "Chris Beall" <Chris_Beall@prodigy.net> - 2014-10-31 10:37 -0400
  Re: DOM styling modified by <body onload=> JavaScript does not affect first rendering "Chris Beall" <Chris_Beall@prodigy.net> - 2014-10-31 12:53 -0400
    Re: DOM styling modified by <body onload=> JavaScript does not affect first rendering Joao Rodrigues <groups_jr-1@yahoo.com> - 2014-11-01 10:41 -0200
      Re: DOM styling modified by <body onload=> JavaScript does not affect first rendering Thomas 'PointedEars' Lahn <PointedEars@web.de> - 2014-11-01 15:29 +0100
      Re: DOM styling modified by <body onload=> JavaScript does not affect first rendering "Chris Beall" <Chris_Beall@prodigy.net> - 2014-11-01 18:03 -0400

csiph-web