nicht angemeldet
Hab hier ein kleines Modell des eigentlichen Problems. Das Problem eigentliche Problem bei der Sache ist dass ich die drei Abschnitte getrennt voneinander steuern möchte.
Also ich erklärs mal so:
Ich habe eine Übersichtsseite mit mehreren Diagrammen (ca.15) welche unterhalb der Links sind und durch betätigen der Links verändert sich die Ansicht des Diagramms. Was durch die Farbgebung der einzelnen Links verdeutlicht werden sollte. Deswegen ist auch in diesem Beispiel schon von Start an der erste rot hinterlegt.
Und immer wenn ich ein anderes anwähle soll natürlich dieses rot hinterlegt werden.
Nur ist es momentan so, dass es lediglich für ein einziges Diagramm funktionieren würde, da ich die Abschnitte bzw. Diagramme in Klassen einteilen muss damit richtig funktioniert!
Hoffe das ist nach dem zweitenmal durchlesen verständlich ;)
<html>
<head>
<title>Unbenannt</title>
<style type="text/css">
<!--
a {
font-family: Verdana, Arial;
color: #000000;
text-decoration: none;
background-color: #EEEEEE;
}
-->
</style>
<script type="text/javascript">
function save(sav)
{
document.getElementsByName('peter')[0].value = sav;
}
function CChange(name)
{
id = name;
document.getElementById(id).style.color = "#FFFFFF"; /* farbe des letzten inks */
document.getElementById(id).style.backgroundColor = "#AA00AA"; /* Hintergrundfarbe des letzten inks */
save(id);
}
function load(id)
{
vall = document.getElementsByName('peter')[0].value;
document.getElementById(vall).style.color = "#000000"; /* normale link-farbe */
document.getElementById(vall).style.backgroundColor = "#EEEEEE"; /* normale link-Hintergrundfarbe */
CChange(id);
}
function red()
{
document.getElementById('link1').style.color = "#FFFFFF";
document.getElementById('link1').style.backgroundColor = "#AA00AA";
document.getElementById('link4').style.color = "#FFFFFF";
document.getElementById('link4').style.backgroundColor = "#AA00AA";
document.getElementById('link7').style.color = "#FFFFFF";
document.getElementById('link7').style.backgroundColor = "#AA00AA";
}
</script>
</head>
<body onload="javascript:red()">
<input type="hidden" name="peter" value="link1">
<a href="#" onclick="javascript:load(this.id)" id="link1">bla 1</a>
<br><br>
<a href="#" onclick="javascript:load(this.id)" id="link2">blö 1</a>
<br><br>
<a href="#" onclick="javascript:load(this.id)" id="link3">blub 1</a>
<br><br><br><br><br>
<a href="#" onclick="javascript:load(this.id)" id="link4">bla 2</a>
<br><br>
<a href="#" onclick="javascript:load(this.id)" id="link5">blö 2</a>
<br><br>
<a href="#" onclick="javascript:load(this.id)" id="link6">blub 2</a>
<br><br><br><br><br>
<a href="#" onclick="javascript:load(this.id)" id="link7">bla 3</a>
<br><br>
<a href="#" onclick="javascript:load(this.id)" id="link8">blö 3</a>
<br><br>
<a href="#" onclick="javascript:load(this.id)" id="link9">blub 3</a>
</body>
</html>