nicht angemeldet
<div>-Bereich nachträglich beschreiben
Hallo!
Zur Zeit beschäftige ich mich mit einer kleinen JavaScript-Spielerei. Und zwar wollte ich eine Seite machen, wo sich das Hauptfenster erst langsam ausklappt. Ja, ist zwar sehr lästig auf die dauer und ich werde es auch nie als richtige Seite benutzen, aber ich wollte es spaßeshalber mal ausprobieren.
So, das Fenster, das sich ausklappt ist ein <div>-Bereich, der am Anfang klein und leer ist, und später, wenn er ausgeklappt ist ein Iframe oder Ähnliches enthalten soll.
Dieses Iframe sollte aber erst dann in dem <div>-Bereich erscheinen, wenn er vollständig ausgeklappt ist.
Hier erstmal mein bisheriges "Ausklapp"-Script (welches auch funktioniert):
##################################
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<HTML>
<HEAD>
<TITLE>DivTest</TITLE>
<style type="text/css">
<!--
A:link {color: #000000; text-decoration: none; }
A:active {color: #FFFF00; text-decoration: none; }
A:visited {color: #000000; text-decoration: none; }
A:hover {color: #FFFFFF; text-decoration: none; }
-->
</style>
<script type="text/javascript">
<!--
BildschirmBreite = eval(screen.width/4-20);
BildschirmHoehe = eval(screen.height/4-50);
Scrollgeschw = 4;
function BreiteAendern(i)
{
var Geschwindigkeit = i*Scrollgeschw;
document.getElementById("div1").style.width = Geschwindigkeit + "px";
if(i==BildschirmBreite)
{
for(j=1; j<=BildschirmHoehe; j++)
{
setTimeout('HoeheAendern('+j+')',30*j);
}
}
}
function HoeheAendern(j)
{
var Geschwindigkeit = j*Scrollgeschw;
document.getElementById("div1").style.height = Geschwindigkeit + "px";
if(j==BildschirmHoehe)
{ alert('done'); }
}
function Aufklappen()
{
for(i=1; i<=BildschirmBreite; i++)
{
setTimeout('BreiteAendern('+i+')',30*i);
}
}
//-->
</script>
</HEAD>
<BODY bgcolor="#444444">
<div id="div1" style="background-color:#999999; height:20px; width:50px; border-width:2px; border-style:solid; border-color:#000000;">
<a href="#" onClick="Aufklappen(); return false"><span style="font-family:Wingdings 3; font-size:20pt;">Æ</span></a>
</div>
</BODY>
</HTML>
###############################################
Wenn das Fenster also aufgeklappt wird, wird eine Meldung mit "done" erscheinen. Diese Meldung ist nur ein Test. Später soll zu diesem Zeitpunkt eine Funktion aufgerufen werden, die ein Iframe in den ausgeklappten <div>-Bereich setzen soll. Mit document.getElementById("div1").write('blabla'); klappt es nicht, da das "Objekt diese Methode nicht unterstützt".
Jetzt hatte ich mir gedacht, dass man das vielleicht auch so machen könnte, nur komme ich nicht weiter:
Man ändert den <div>-Bereich wie folgt ab:
<div id="div1" style="background-color:#999999; height:20px; width:50px; border-width:2px; border-style:solid; border-color:#000000;">
<a href="#" onClick="Aufklappen(); return false"><span style="font-family:Wingdings 3; font-size:20pt;">Æ</span></a>
<script type="text/javascript">
<!--
document.write(Text);
//-->
</script>
</div>
und oben sollte man noch als globale Variable die Variable "Text" einbauen (irgendwo unter den Variablen "BildschirmHoehe" oder so)
Diese Variable "Text" möchte ich dann ändern, sodass der Text auch geändert wird.
Bei einem Test von mir änderte sich der Text aber nicht!
Ich hoffe, der Text hier war halbwegs verständlich. ;)
Danke schonmal im Vorraus für eure Mühen!
Gruß
Mastershrimp
-
hi,
Wenn das Fenster also aufgeklappt wird, wird eine Meldung mit "done" erscheinen. Diese Meldung ist nur ein Test. Später soll zu diesem Zeitpunkt eine Funktion aufgerufen werden, die ein Iframe in den ausgeklappten <div>-Bereich setzen soll. Mit document.getElementById("div1").write('blabla'); klappt es nicht, da das "Objekt diese Methode nicht unterstützt".
logisch. write ist eine methode von document - dein div ist aber nicht document.
sieh dir unter http://selfhtml.teamone.de/javascript/objekte/node.htm, wie du weitere knoten erzeugen, und in den div einhängen kannst.
gruss,
wahsaga