- Registriert
- 06.03.06
- Beiträge
- 356
Moin!
Ich stelle auf einer Seite mehrere Bilder dar. Dazu möchte ich per Klick auf das Bild weitere Informationen zur Verfügung stellen. Ich habe folgenden Code erstellt:
Nun zu dem Problem, was sich dabei für mich ergibt. Wenn man auf Bild 1 klickt, dann öffnen sich darunter wie gewünscht die Informationen. Die Variable yes ist nun allerdings true. Das bedeutet, dass weitere Information von zB Bild 2 nicht mit einem Klick geöffnet werden können. Dazu muss man die Variable erst wieder in den false-Zustand bringen.
Wie muss ich nun den Code verändern. Ich möchte, dass alle Information unabhängig voneinander geschlossen und geöffnet (und umgekehrt) werden können. Ich habe irgendwie ein keine Idee. Kann mir jemand helfen?
Gruß zoom
Ich stelle auf einer Seite mehrere Bilder dar. Dazu möchte ich per Klick auf das Bild weitere Informationen zur Verfügung stellen. Ich habe folgenden Code erstellt:
Code:
<html>
<style type="text/css">
#x1, #x2, #x3, #x4, #x5, #x6, #x7 {
display: none;
}
</style>
</head>
<script type="text/javascript" language="JavaScript1.2">
var yes = false;
function flip(num)
{
if (yes)
{
document.getElementById('x'+num).style.display = 'none';
yes = false;
}
else
{
document.getElementById('x'+num).style.display = 'block';
yes = true;
}
}
</script>
<body>
<div>Bild 1</div>
<a href="javascript: void()" onclick="flip(1)"><img src="bild1.jpg" alt="bild1" /></a>
<div id="x1">Inhalt zu Bild 1</div><br />
<div>Bild 2</div>
<a href="javascript: void()" onclick="flip(2)"><img src="bild2.jpg" alt="bild2" /></a>
<div id="x2">Inhalt zu Bild 2</div><br />
<div>Bild 3</div>
<a href="javascript: void()" onclick="flip(3)"><img src="bild3.jpg" alt="bild3" /></a>
<div id="x3">Inhalt zu Bild 3</div><br />
<div>Bild 4</div>
<a href="javascript: void()" onclick="flip(4)"><img src="bild4.jpg" alt="bild4" /></a>
<div id="x4">Inhalt zu Bild 4</div><br />
<div>Bild 5</div>
<a href="javascript: void()" onclick="flip(5)"><img src="bild5.jpg" alt="bild5" /></a>
<div id="x5">Inhalt zu Bild 5</div><br />
<div>Bild 6</div>
<a href="javascript: void()" onclick="flip(6)"><img src="bild6.jpg" alt="bild6" /></a>
<div id="x6">Inhalt zu Bild 6</div><br />
<div>Bild 7</div>
<a href="javascript: void()" onclick="flip(7)"><img src="bild7.jpg" alt="bild7" /></a>
<div id="x7">Inhalt zu Bild 7</div>
</body>
</html>
Wie muss ich nun den Code verändern. Ich möchte, dass alle Information unabhängig voneinander geschlossen und geöffnet (und umgekehrt) werden können. Ich habe irgendwie ein keine Idee. Kann mir jemand helfen?
Gruß zoom