# Aktiven Link darstellen



## lordimac (30. Juni 2004)

Hi

Ich würde gerne einen aktiven Link darstellen.

Folgendes: Ich habe mein Menu oben sowie den eigentlichen Content  im unteren Bereich  per iFrame eingebunden.

Nun würde ich gerne folgendes realisieren:

Man klickt bsp. auf Link 1 und der Link 1 öffnet sich im iFrame. Link1 soll dann anderst farbig hervorgehoben werden als Link2,3, etc...

Wenn man nun aber Link 2 klickt sollte Link 1 wieder normal aussehen dafür aber Link 2 anderst farbig hinterlegt.

Wie lässt sich das ganze realisieren ? PHP Seiten wären kein Problem, bisher baut alles auf html / CSS auf.

Ein extra Menu für jeden Punkt wollte ich eigentlich vermeiden.

Bin für jeden Tip dankbar.

MfG lordimac


----------



## Gumbo (30. Juni 2004)

PHP ist garnicht nötig:
&nbsp;*&rsaquo;**&rsaquo;*&nbsp;SELFHTML: CSS Stylesheets / CSS-Eigenschaften / Pseudoformate / :link, :visited, :hover, :active, :focus (Pseudoformate für Verweise)


----------



## lordimac (30. Juni 2004)

Du meinst aber nciht zufällig A:active oder ?

a:active ist nur für das Klicken von Link in welcher Farbe er da erscheinen soll.


----------



## lordimac (1. Juli 2004)

ah ok a:active ist auch dafür geeignet muss ich gerade beerken, allerdings funktioniert das ganze nur im InternetExplorer und nicht im Mozilla. Ich bräuchte eine Browser übergreifende Lösung


----------



## King Euro (1. Juli 2004)

schau mal hier:
bitte klick mich!

:edit:
Ich hoffe ich habe das Problem geschnallt.


----------



## PeeWee (1. Juli 2004)

*activ links*

Hi,

soweit wie ich das weiß, kannst du ide Links in der CSS alle eigens anlegen. 

Das würde dann ungefair so aussehen:

a:link {
text-decoration: none;
z-index: 15;
color: #605C5C;
}

a:visited {
text-decoration: none;
z-index: 15;
color: #605C5C;
}

a:aktiv {
text-decoration: none;
z-index: 15;
color: #605C5C;
}

a:hover {
text-decoration: none;
z-index: 15;
color: #605C5C;
}


Du kannst die links auch für einzelne Divs anlegen. 

also z.B. 

#nebenlinks a:hover { u.s.w.}

Gruß

PeeWee


----------



## Sven Mintel (2. Juli 2004)

Mit CSS alleine lässt sich das kaum lösen.

Du kannst Javascript zuhilfe nehmen:

```
<script type="text/javascript">
<!--

arrLinkObjs=new Array();

function init(obj)
{
if(document.getElementById)
    {
    arrLinkObjs.push(obj);
    obj.onclick=new Function('F','aktivieren(this)');
    aktivieren(obj);
    }
}


function aktivieren(obj)
{
for(j=0; j < arrLinkObjs.length; ++j)
    {
    arrLinkObjs[j].className = (arrLinkObjs[j]==obj)
                                ?'aktiv'    //aktiver Klassenname
                                :'inaktiv'; //inaktiver Klassenname
    }
}
//-->
</script>
```

Alles was du tun musst...

definiere 2 CSS-Klassen für den aktiven und inaktiven Link(hier aktiv/inaktiv)

In den Links selbst musst du natürlich erstmal den inaktiven Klassennamen notieren, und im onClick-Event die Function _init()_ aufrufen....das wars schon.

```
<a class="inaktiv"onclick="init(this)"href="seite.htm">link1</a>
```

Beim ersten Click auf den Link wird selbiger als Objekt in einen Array eingefügt und sein onClick-Attribut geändert...dort wird nun die Funktion _aktivieren()_ aufgerufen.

Die Funktion _aktivieren()_ geht alle Elemente des Arrays mit den Objekten durch und ändert deren className entsprechend.

Das funktioniert nicht nur mit Links...du kannst es bei beliebigen Seitenelementen anwenden.
Falls in dem jeweiligen Seitenelement bereits ein onClick definiert ist, dann sag Bescheid, dann muss man es noch etwas modifizieren.

Test


----------

