Hallo > Beim onload wird vom header die Höhe ermittelt > > ~~~javascript > window.onload = function() { > document.getElementsByTagName('main')[0].style.top = > document.getElementsByTagName('header')[0].offsetHeight + 'px'; > } > ~~~ Kein wirklich gutes Beispiel, wie du ja selbst schon angemerkt hast. Anstelle des **load**-Events, das erst feuert, wenn wirklich _alle_ Ressourcen vollständig geladen sind, sollte hier besser das **DOMContentLoaded**-Event als Einstiegspunkt genutzt werden. Denn je nach Inhalt kann durchaus ein merklicher Zeitunterschied bestehen und Änderungen im Layout würden erst erfolgen, wenn die Seite bereits zur Anzeige gebracht wurde, was sich negativ auf die UX auswirken dürfte. Um sicherzugehen, dass das Stylesheet zum Zeitpunkt des Event-Dispatch fertig geladen und angewandt ist, sollte das Script grundsätzlich am Ende von Body eingebunden werden. Außerdem sollten Handlerfunktionen _nicht_ als Objekteigenschaften hinterlegt, sondern als Callback der **addEventListener**-Methode übergeben werden. Gerade wenn jemand noch nicht so vertraut ist mit JavaScript und den Tücken des Eventhandlings, ist denke ich die Gefahr sehr groß, dass der Eigenschaftswert _überschrieben_ wird, da dem TO vielleicht einfällt, dass er noch ein paar _mehr_ Funktionen ausführen möchte, wenn die Seite geladen ist. Darum besser: ~~~ javascript document.addEventListener('DOMContentLoaded', function ( ) { // ... }); ~~~ Oder: ~~~ javascript var myCallback = function ( ) { // ... }; document.addEventListener('DOMContentLoaded', myCallback); ~~~ Aber das weißt du ja [selbst](http://forum.selfhtml.org/self/2015/aug/20/onclick-vs-onchange/1648400#m1648400)… ;-) Gruß, Orlok

Hallo > Beim onload wird vom header die Höhe ermittelt > > ~~~javascript > window.onload = function() { > document.getElementsByTagName('main')[0].style.top = > document.getElementsByTagName('header')[0].offsetHeight + 'px'; > } > ~~~ Kein wirklich gutes Beispiel, wie du ja selbst schon angemerkt hast. Anstelle des **load**-Events, das erst feuert, wenn wirklich _alle_ Ressourcen vollständig geladen sind, sollte hier besser das **DOMContentLoaded**-Event als Einstiegspunkt genutzt werden. Denn je nach Inhalt kann durchaus ein merklicher Zeitunterschied bestehen und Änderungen im Layout würden erst erfolgen, wenn die Seite bereits zur Anzeige gebracht wurde, was sich negativ auf die UX auswirken dürfte. Um sicherzugehen, dass das Stylesheet zum Zeitpunkt des Event-Dispatch fertig geladen und angewandt ist, sollte das Script grundsätzlich am Ende von Body eingebunden werden, oder wenigstens, wie du es ja gemacht hast, _nach_ dem Stylesheet. Außerdem sollten Handlerfunktionen _nicht_ als Objekteigenschaften hinterlegt, sondern als Callback der **addEventListener**-Methode übergeben werden. Gerade wenn jemand noch nicht so vertraut ist mit JavaScript und den Tücken des Eventhandlings, ist denke ich die Gefahr sehr groß, dass der Eigenschaftswert _überschrieben_ wird, da dem TO vielleicht einfällt, dass er noch ein paar _mehr_ Funktionen ausführen möchte, wenn die Seite geladen ist. Darum besser: ~~~ javascript document.addEventListener('DOMContentLoaded', function ( ) { // ... }); ~~~ Oder: ~~~ javascript var myCallback = function ( ) { // ... }; document.addEventListener('DOMContentLoaded', myCallback); ~~~ Aber das weißt du ja [selbst](http://forum.selfhtml.org/self/2015/aug/20/onclick-vs-onchange/1648400#m1648400)… ;-) Gruß, Orlok

Hallo > Beim onload wird vom header die Höhe ermittelt > > ~~~javascript > window.onload = function() { > document.getElementsByTagName('main')[0].style.top = > document.getElementsByTagName('header')[0].offsetHeight + 'px'; > } > ~~~ Kein wirklich gutes Beispiel, wie du ja selbst schon angemerkt hast. Anstelle des **load**-Events, das erst feuert, wenn wirklich _alle_ Ressourcen vollständig geladen sind, sollte hier besser das **DOMContentLoaded**-Event als Einstiegspunkt genutzt werden. Denn je nach Inhalt kann durchaus ein merklicher Zeitunterschied bestehen und Änderungen im Layout würden erst erfolgen, wenn die Seite bereits zur Anzeige gebracht wurde, was sich negativ auf die UX auswirken dürfte. Um sicherzugehen, dass das Stylesheet zum Zeitpunkt des Event-Dispatch fertig geladen und angewandt ist, sollte das Script grundsätzlich am Ende von Body eingebunden werden, oder wenigstens, wie du es ja gemacht hast, _nach_ dem Stylesheet. Außerdem sollten Handlerfunktionen _nicht_ als Objekteigenschaften hinterlegt, sondern als Callback der **addEventListener**-Methode übergeben werden. Gerade wenn jemand noch nicht so vertraut ist mit JavaScript und den Tücken des Eventhandlings, ist denke ich die Gefahr sehr groß, dass der Eigenschaftswert _überschrieben_ wird, da dem TO vielleicht einfällt, dass er noch ein paar _mehr_ Funktionen ausführen möchte, wenn die Seite geladen ist. Darum besser: ~~~ javascript document.addEventListener('DOMContentLoaded', function ( ) { // ... }); ~~~ Aber das weißt du ja [selbst](http://forum.selfhtml.org/self/2015/aug/20/onclick-vs-onchange/1648400#m1648400)… ;-) Gruß, Orlok