Alle Ebenen vorerst verstecken

madom

Grünschnabel
Hallo,

Gibt es hierzu eine einfache Lösung?:

Bevor die Seite nicht vollständig geladen ist, sollten alle Ebenen ("layers") versteckt ("hidden") sein. "OnLoad" sollten sie dann ihren vordefinierten Status einnehmen.

Ich möchte aber nicht einen Layer über alles legen, der OnLoad verwschwindet, diese Lösung ist hierbei nicht gut, da der Rest der Seite angezeigt werden sollte, nur die Layers nicht.

Geht das?

Danke,
m.
 
Ich würde eine CSS-Klasse definieren, welche nur das Format visibility:hidden;
enthält. Die "Layer" dann alle dieser Klasse zuordnen, beim Onload dann alle Elemente durchlaufen- ist der className des Elementes der entsprechende, auf "visible" stellen.

Sinnvollerweise sollte die eingangs erwähnte Klassendefinition mit Javascript in die Seite geschrieben werden, damit Besucher ohne Javascript überhaupt was zu sehen bekommen.
 
Danke für Deine Antwort. Das tönt interessant, aber ich habe es leider nicht ganz verstanden...

Ich verstehe nicht, was Du mit "beim Onload dann alle Elemente durchlaufen" meinst.

Um die Ausgangslage zu verstehen, kannst Du mal hier schauen. Wenn Deine Leitung nicht gerade super-super-super schnell ist, siehst du die Layers erst unten auf der Seite aufpoppen, dann erst an ihren Platz springen. Ziemlich unschön, nicht?

Lieber Gruss,
m.
 
Ich und schnelle Leitung :( :mad:

Oh ja.... das dauert einen Moment, bis es geladen ist... 700 Zeilen Scripcode in einer Seite bekommt man aber auch selten zu sehen ;)

Was ich mit dem "Durchlaufen" meine.... alle diese Layer sind ja <div>'s ...die kannst du in einer Schleife bequem durchlaufen, indem du
ihre Gesamtzahl mit document.getElementsByTagName('div').length ermittelst, bei 0 anfängst und so lange hochzählst, bis alle Layer
durch sind... document.getElementsByTagName('div')[0] ist zum Beispiel das erste <div>-Element einer Seite(falls vorhanden).

Das mit den sich verschiebenden Layern habe ich gesehen...

um das zu beheben, ist es besser, das style-Attribut "display" auf "none" zu stellen, dann werden die Layer vorerst auch nicht angezeigt... der Unterschied zu
visibility:hidden ist dabei aber, dass sie damit auch keinen Platz in Anspruch nehmen.... als ob sie nicht existierten.

Da du in der Seite, soweit ich sehen konnte, keinen Elementen eine display-Eigenschaft zugewiesen hast, muss man in der Schleife nicht mal den CSS-Klassennamen erfragen, sondern kann
einfach die display-Eigenschaft aller <div>'s ändern.

Nachfolgend das Skript... für .ggBildlayer,.ggKartenLayer,.ggTextLayer wird dabei erstmal ein <style>-Block in die Seite geschrieben,
mit welchem die Mitglieder dieser Klassen versteckt werden.... hab dabei die http://www.kinderlein.ch/chind_seiten/chind_home.htm genommen... ob das in den anderen Seiten genauso läuft, hab ich dabei nicht probiert, aber das Prinzip sollte immer dasselbe sein:
Code:
layersAreHidden=false;
function showHiddenLayers()
	{
	if(layersAreHidden==false){return;}
	for(nr=0;nr< document.getElementsByTagName('div').length;++nr)
		{
		document.getElementsByTagName('div')[nr].style.display='block';
		}
	}
if(layersAreHidden=(document.getElementsByTagName&&document.getElementsByTagName('title')[0].innerHTML))
	{
		document.write('<style type="text/css">.ggBildlayer,.ggTextLayer,.ggKartenLayer{display:none;}</style>');
	}
Das füge am Ende des <script>-Tags im <head> ein.
Im <body>-Tag musst du noch zusätzlich im onload-Event showHiddenLayers(); notieren.
Laufen tuts in Opera7, Netscape7, Mozilla und IE5+

Apropos Opera... da ist die Reiseroute bei mir nach oben verschoben.... z.B. teilweise in der Adria

Zu den 700 Zeilen Scriptcode.... ich glaube, das ganze könnte man auf ein Zehntel schrumpfen,... da die Routenanimation ohnehin nur mit Javascript funktioniert, könnte man den ganzen Code für die Layer
in einer Schleife in die Seite schreiben lassen.... das sollte sie ungleich schneller machen :)
 
Zuletzt bearbeitet:
:-) :-) Mann fatalus, Du machst mich glücklich. Klappt super, dein Script. Vielen herzlichen Dank. :-) :-)

Dass mit den 700 Zeilen Scriptcode hat mir der DW reingebremst. Es kommt daher, dass ich die Ebenen-Ein- und Ausblendung über die Zeitleiste steuere. Leider bin ich sehr unerfahren im JS und HTML, deshalb muss ich zu solchen Methoden greifen.

Ich bin sicher, dass man den Code ohne weiteres auf einen Zehntel reduzieren könnte, Dein Vorschlag mit der Schlaufe tönt hier sehr gut. Ich muss mich einmal hinsetzen und mich einarbeiten, vielleicht kriegte ich es hin...

Danke auch für den Hinweis, dass die Ebeneausrichtung in Opera nicht stimmt. Ich muss das anschauen, keine Ahnung woran das liegen könnte.

Auf jeden Fall bin ich schon super happy mit Deiner Hilfe, jetzt sieht das ganze doch schon sehr ansprechend aus, wenn auch noch langsam, aber das ist bei ca. 0.5 MB pro Seite (aufgrund der vielen Bilder) auch kein Wunder.

mit :) glücklichen :) Grüssen
m.
 

Neue Beiträge

Zurück