nicht angemeldet
! Lösung für LayerTechnik mit sichtbar/unsichtbar !
! Hay future-programmer !
Nach durchzechten Nächten biete ich hier nunendlich eine geniale Lösung an, die mittels JavaScript Elemente sichtbar/unsichtbar schalten kann - funktioniert auf allen neueren Browsern (auf dem komischen NS4.7 natürlich NICHT!):
---------JavaScript-Schalter für visible/hidden:
<html>
<head>
<title>:: visibility ::</title>
<script language="JavaScript" type="text/javascript">
<!--
function zeige() {
if(document.getElementById)
document.getElementById("ueberschrift").style.visibility = "visible";
}
function verstecke() {
if(document.getElementById)
document.getElementById("ueberschrift").style.visibility = "hidden";
}
function schalter() {
if(document.getElementById("ueberschrift").style.visibility == "hidden")
document.getElementById("ueberschrift").style.visibility = "visible";
else
document.getElementById("ueberschrift").style.visibility = "hidden";
}
//-->
</script>
</head><body bgcolor="FFFFFF" text="#000000">
<h1 id="ueberschrift" style="visibility:hidden">Die Überschrift zum Text</h1>
<p>Hier der Text. Aber fehlt da nicht was?</p>
<p><a href="javascript:zeige()">Anzeigen!</a></p>
<p><a href="javascript:verstecke()">Verstecken!</a></p>
<p><a href="javascript:schalter()">Anzeigen-Verstecken</a></p>
</body>
</html>
---------funktionierende übersichtliche LayerTechnologie:
---------(funktioniert in NS 4.7 / NS 6.0 / IE 5.0 und IE 5.5 / Opera 6 !):
<HEAD>
<TITLE> LAYER-StilTechnik </TITLE>
<style type="text/css">
<!--
#bild001 { position:absolute; left:300pt; top:100pt; z-Index:1; }
#bild002 { position:absolute; left:170pt; top:150pt; z-Index:2; }
#bild003 { position:absolute; left:240pt; top:220pt; z-Index:3; }
#bild004 { position:absolute; left:240pt; top:220pt; z-Index:4; }
#textfeld001 { position:absolute; left:60pt; top:70pt; z-Index:5; }
#textfeld002 { position:absolute; left:200pt; top:140pt; z-Index:6; }
//-->
</style>
</HEAD>
<BODY>
<div id="bild001"><img src="BILDER/frN01.gif" width="70" height="58" border="0" alt="xxx"></div>
<div id="bild002"><img src="BILDER/frNietzsche1t2.jpg" width="70" height="58" border="0" alt="xxx"></div>
<div id="bild003"><img src="BILDER/frNietzsche1.jpg" width="70" height="58" border="0" alt="xxx"></div>
<div id="bild004"><img src="BILDER/frNietzsche1t1.gif" width="70" height="58" border="0" alt="xxx"></div>
<div id="textfeld001">
<table width=100px height=160px>
<td> 1111</td>
<td> 2222</td>
</table>
</div>
<div id="textfeld002">
<table width=140px height=80px>
<td> xxxx</td>
<td> yyyy</td>
</table>
</div>
</body>
-------------
Viel Spass
and go onto future
Klaus
-
Hallo Klaus,
sorry, die wirkliche Begeiterung will bei mir nicht aufkommen, weil:
1. Ist das doch einer der ältesten Hüte überhaupt
2. Ist für solche Fälle die Einbeziehung von NS 4.x und IE 4 nun wirklich eine der einfacheren Übungen, und
3. AAARRRGGGGHHHHH!!! Du willst uns hier doch nicht wirklich eine HTML-Datei anbieten, die _zwei_ Head- und _zwei_ Body-Bereiche hat, oder?Grüße,
Utz
-
Hio,
sry, aber irgendwie kommts ein wenig vor als müsstest hier "den dicken" markieren, nur weil ein Anfänger sich freud eine Lösung für ein Problem gefunden zu haben und das bedürfnis hat dies mitzuteilen. Seine Lösung ist nicht wirklich professionel, ok das ist auch meine Meinung. Aber deine Antwort auch nicht.
Lies dir diese nochmal durch und frage dich was du wirklich an verbesserung oder Lösungen aufbietest. und?
gruss
Thorsten
-
Hallo Thorsten,
Lies dir diese nochmal durch und frage dich was du wirklich an verbesserung oder Lösungen aufbietest. und?
Na gut, dann halt noch mal so, dass man auch direkt draufklicken kann und nicht erst suchen muss: http://selfhtml.teamone.de/dhtml/beispiele/dhtml_bibliothek.htm und http://selfhtml.teamone.de/dhtml/beispiele/navigation.htm.
Grüße,
Utz
-
-
-
Hi Klaus,
Das ganze läuft so nicht auf NN4.x oder IE 4.x.
Den IE4.x könntest du in deine Lösung einbeziehen, müsstest dann anstatt bsw. document.getElementById("ueberschrift").style.visibility = "visible"; einfach document.all["ueberschrift"].style.visibility = "visible"; schreiben.
Der IE4.x macht ein Array aller Elemente der Seite und nennt dieses all.Eine Lösung für den NN4.x gibts hier nicht (zumindest nicht direkt), da bei diesem Browser kein Zugriff auf eine h2 möglich ist, dies ist für in aus Sicht von Javascript einfach nicht präsent. Der NN4.x kann nur Ebenen ein/ausblenden.
<p><a href="javascript:zeige()">Anzeigen!</a></p>
hm, dies find ich selbst nicht so die ultimative Lösung, ein JavaScript-Befehl über HTML aufzurufen. Das href-Attribut misbrauchst du hierbei, dies hat aber eine klar definierte Aufgabe und diese ist imho _nicht_ JavaScript auszuführen. Bedenke dabei was bei einem Browser ohne JavaScript vorsich geht.
Die bessere Lösung finde ich
<a href="#" onclick="javascript:zeige();return false;">Anzeigen!</a>das return false verhindert das "ausführen" von href.
kleiner Tipp zum Schluss, poste nicht einfach den Quellcode einer ganzen Seite, sondern beschränke dich lieber auf das wesentliche dabei.
gruss
Thorsten
-
Hi,
Das ganze läuft so nicht auf NN4.x oder IE 4.x.
Den IE4.x könntest du in deine Lösung einbeziehen, müsstest dann anstatt bsw. document.getElementById("ueberschrift").style.visibility = "visible"; einfach document.all["ueberschrift"].style.visibility = "visible"; schreiben.Nicht anstatt, sondern zusätzlich, nach Abprüfung, welche Variante jeweils sinnvoll ist...
Die bessere Lösung finde ich
<a href="#" onclick="javascript:zeige();return false;">Anzeigen!</a>Diese Lösung ist falsch. javascript: ist keine Javascript-Anweisung, hat also im Event-Handler nichts verloren.
cu,
Andreas--
Der Optimist: Das Glas ist halbvoll. - Der Pessimist: Das Glas ist halbleer. - Der Ingenieur: Das Glas ist doppelt so groß wie nötig.-
Hi Andreas,
Nicht anstatt, sondern zusätzlich, nach Abprüfung, welche Variante jeweils sinnvoll ist...
hm, so hatte ichs eigentlich gemeint.
Die bessere Lösung finde ich
<a href="#" onclick="javascript:zeige();return false;">Anzeigen!</a>Diese Lösung ist falsch. javascript: ist keine Javascript-Anweisung, hat also im Event-Handler nichts verloren.
upps, mittelschwerer Copy&Paste-Fehler ;) Klar hat da ein javascript: nix verloren.
gruss
Thorsten
-
-