Zwischen hidden und visible wechseln?
Alex
- javascript
0 Andreas Schneider0 Alex0 Dark Sider0 Alex
Hallo
ich hab hier in Selfhtmal gelesen wie man mit Javascript etwas sichtbar bzw. unsichtbar machen kann jezt wollte ich ein Menü machen das man auf und zuklappen kann.
Ich habe den Qelltext von den ich von Selfhtml habe ein bisschen verändert aber irgendwo ist ein Fehler - sorry es ist das erste mal das ich mich mit JS beschäftige
<html><head><title>visibility</title>
<script language="JavaScript" type="text/javascript">
<!--
var zeige = "0";
function show() {
if(document.getElementById)
{
if(zeige == "0")
{
document.getElementById("Ueberschrift").style.visibility = "visible";
var zeige = "1";
}
elseif(zeige == "1")
{
document.getElementById("Ueberschrift").style.visibility = "hidden";
var zeige = "0"
}
}
}
//-->
</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:show()">Anzeigen!</a></p>
</body></html>
wie kann ich machen das nach dem sichtbarmachen die variable zeigen 1 wird?? Wenn ich var zeige = "1" und var zeige ="2" in den if's weglasse klappt es.
danke schonmal
mfg
Alex
Hallo Alex,
sorry es ist das erste mal das ich mich mit JS beschäftige
Dafür brauchst Du Dich nicht entschuldigen.
Hier deklarierst Du eine Variable "zeige":
var zeige = "0";
function show() {
if(document.getElementById)
{
Hier fragst Du diese Variable ab:
if(zeige == "0")
{
document.getElementById("Ueberschrift").style.visibility = "visible";
Hier deklarierst Du eine neue Variable zeige, die nur innerhalb der if-Abfrage gültig ist.
var zeige = "1";
Nimm innerhalb der if-Abfrage die vars raus (zeige = "0" statt var zeige = 0), dann geht es.
Übrigens, die Anführungszeichen sind überflüssig. Genausogut kannst Du mit Zahlen arbeiten (zeige = 0)
Grüße
Andreas
Hallo
danke erstmal
kannst du hier bitte den Quelltext posten mit dem es funktioniert weil ich bekomm das irgendwie nicht hin
mfg
ALex
Hi,
was genau willst du machen?
Du hast ein Element und willst es gegen ein anderes austauschen, wenn ich dich recht verstehe?
MfG
Dark Sider
Hallo
wenn ich einmal auf den link klicke soll der hidden teil sichtbar werden wenn ich dann nocmal draufklicke soll er wieder verschwinden
wie kann ich sowas machen??
mfg
aLEx
Hi,
was hast du schon probiert, was sagt dein Browser dazu?
Inwiefern hast du Andreas Posting berücksichtigt?
MfG
Dark Sider
Hi,
so siehts jezt aus:
<html><head><title>visibility</title>
<script language="JavaScript" type="text/javascript">
<!--
function show(zeige) {
if(document.getElementById)
{
if(zeige != 1)
{
document.getElementById("Ueberschrift").style.visibility = "visible";
zeige = 1;
}
else if(zeige == 1)
{
document.getElementById("Ueberschrift").style.visibility = "hidden";
zeige = 0;
}
}
}
//-->
</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:show()">Anzeigen!</a></p>
</body></html>
ich habe die " " weggetan und var habe ich auch weg jezt zeigt der IE auch keinen Fehler mehr an. Wenn ich draufklicke kommt der Text aber wenn ich dann nochmal klicke passiert nichts obwohle der Taxt dann wieder verschwinden sollte.
mfg
aLEx
Hi,
<html><head><title>visibility</title>
<script language="JavaScript" type="text/javascript">
<!--
definiere die Variable "zeige" hier:
var zeige;
und laß sie hier weg:
function show() {
Dann klappt das auch.Warum? Wenn Du die variable in
function show(zeige)
definierst, wird sie immer den Wert annehmen, den du beim Aufruf der Funktion übergibst. Du übergibst aber nichts:
<p><a href="javascript:show()">Anzeigen!</a></p>
Die klammer ist leer. Darum trifft auch immer:
if(zeige != 1)
zu. Deswegen: außerhalb der Funktion definieren, damit "zeige" eine globale Variable ist und sich den Wert merken kann.
Du kannst natürlich auf die Variable auch ganz verzichten, wenn Du gleich abfrägst, ob das Element sichtbar/ unsichtbar ist.
Am elegantesten so:
<script language="JavaScript" type="text/javascript">
<!--
function show() {
if(document.getElementById)
{
document.getElementById("Ueberschrift").style.visibility = (document.getElementById("Ueberschrift").style.visibility == "hidden") ? "visible" : "hidden";
}
}
//-->
</script>
Grüße,
Ronny