hi...ich habe was wirkliches nettes gebastelt ;):
<html>
<head>
<script>
var currentItem = "link_1";
function Navigation(Id) {
var CssClassActive = "active";
var CssCLassInactive = "inactive";
// Altem Item inaktive Klasse zuweisen
if(currentItem != "") {
document.getElementById(currentItem).className = CssCLassInactive;
}
// Neuem Item aktive Klasse zuweisen
document.getElementById(Id).className = CssClassActive;
// Neues Item merken
currentItem = Id;
}
</script>
<style>
a.active {
color: green
}
a.inactive {
color: blue
}
</style>
</head>
<body>
<a href="#" id="link_1" class="inactive" onclick="Navigation(this.id);">Link 1</a><br/>
<a href="#" id="link_2" class="inactive" onclick="Navigation(this.id);">Link 2</a><br/>
<a href="#" id="link_3" class="inactive" onclick="Navigation(this.id);">Link 3</a><br/>
<a href="#" id="link_4" class="inactive" onclick="Navigation(this.id);">Link 4</a><br/>
</body>
</html>
aber wenn ich "real links" statt des "#" einsetze klappt das mit dem aktiven link nicht mehr!
so ein mist...hat jemand eine idee????
Ist doch klar, weil die Seite dann neu aufgebaut wird.
<html>
<head>
<style>
a {
color: blue
}
a:active, a:focus {
color: green
}
</style>
</head>
<body>
<a href="#">Link 1</a><br/>
<a href="#">Link 2</a><br/>
<a href="#">Link 3</a><br/>
<a href="#">Link 4</a><br/>
</body>
</html>
Das hat den gleichen Effekt. ;-)
Musst eben auf jeder Seite die Klasse .active an den richtigen Link vergeben, damit dieser hervorgehoben wird.
Nachtrag: mit JavaScript kannst du das lösen, indem du bei einem Klick den Namen des geklickten Links als window.name speicherst, dann kannst du auf der nächsten Seite window.name wieder auslesen und den aktiven Zustand zuweisen, weil window.name auch seitenübergreifend erhalten bleibt.
aarrg. mit window.?
kannst du mir ein beispiel geben...ich stehe gerade auf dem schlauch.
nachtrag:
sieht aus, als würde das nicht ganz einfach werden....
http://aktuell.de.selfhtml.org/artikel/javascript/wertuebergabe/index.htm#a4
mach das einfach über einen URL-Parameter asd.htm?mark=link_1 oder so.
Oder gleich ein CMS.
Seitentitel: cooles active link menü....