Anzeige: united-domains - Die ganze Welt der Domains
Einfache & schnelle Domain-Registrierung zu fairen Preisen ohne Einrichtungsgebühren. Mehr als 250 Domain-Endungen aus einer Hand inklusive E-Mail- & Web-Weiterleitung. Einzigartiges Domain-Portfolio zur bequemen & sicheren Verwaltung Ihrer Domain-Namen.
Jetzt Domain-Check bei united-domains!
Aktiver Link dauerhaft hervorheben
Autor: SimplyFred
Datum: 23.12.2011 12:50:07
Hallo ich habe ein Menu gebastelt, wo der "aktive angeklickte Link" hervorgehoben sein soll, genau so wie mit
"a:active" aber dauerhaft. "a:active" gilt ja nur für die Zeit des Klicks
Wer kann mir dazu etwas sagen?
Ich komme nicht weiter:
menu.css
#linksmenu a{
float: right;
width: 183px;
height: 20px;
background-color: #FFFFFF;
border-left: solid 0px #CCCCCC;
border-bottom: solid 1px #CCCCCC;
font: arial;
font-size: 12px;
font-weight: ;
color: #000000;
text-decoration: none;
padding-top: 5px;
white-space: normal;
text-indent: 5px;
}
#linksmenu a:hover{
background-color:#CCCCCC;
color: #000000;
}
#linksmenu a:active{
background-color:#000000;
color: #FFFFFF;
}
index.html
<div id="menu" align="right">
<div align="right" style="width:180px; height:10px;"></div>
<div id="linksmenu" align="left">
<a href="index.html" title="Home">Home</a>
<a href="./html/linkl.html" title="linkl.html">linkl.html</a>
<a href="./html/link2.html" title="link2.html">link2.html</a>
<a href="./html/link3.html" title="link3.html">link3.html</a>
<a href="./html/link4.html" title="link4.html">link4.html</a>
</div>
</div>
Re: Aktiver Link dauerhaft hervorheben
Autor: T.Jung
Datum: 23.12.2011 18:18:49
> Hallo ich habe ein Menu gebastelt, wo der "aktive
> angeklickte Link" hervorgehoben sein soll, genau
> so wie mit
> "a:active" aber dauerhaft. "a:active" gilt ja nur
> für die Zeit des Klicks
Das geht nicht per CSS -- jedenfalls nicht automatisch.
Du kannst höchstens eine weitere Klasse anlegen, z.B. "current", mit den gleichen Werten wie für "active". Die Klasse trägst Du dann von Hand in den fraglichen Link ein, also etwa so:
<a href="index.html" title="Home">Home</a>
<a href="./html/linkl.html" class="current" title="linkl.html">linkl.html</a>
<a href="./html/link2.html" title="link2.html">link2.html</a>
(...)
Gruß,
Tobias Jung
Re: Aktiver Link dauerhaft hervorheben
Autor: SimplyFred
Datum: 24.12.2011 21:59:46
Hallo,
ich versuche es nun zum 2. Mal mit beiliegendem Code.
Ergebnis ist nun, sobald ich im HTML anfange, echte Links zu setzen, ist der aktive Menupunkt nicht mehr hinterlegt.
Beim Klick auf Link2-10 klappt es, aber bei Klick auf Home ist Home nicht hinterlegt. Wie bekomme ich das jetzt noch hin?
menu.css
<style type="text/css">
#vertmenu {
font: arial;
font-size: 12px;
width: 180px;
padding: 0px;
margin: 0px;
}
#vertmenu h1 {
display: block;
background-color: #CCCCCC;
margin: 0px;
width: 180px;
}
#vertmenu ul {
list-style: none;
margin: 0px;
padding: 0px;
border: none;
}
#vertmenu ul li a {
font: 12px arial;
display: block;
border-bottom: solid 1px #CCCCCC;
padding: 5px 0px 2px 20px;
text-decoration: none;
color: #000000;
width: 180px;
text-align: left;
white-space: normal;
}
#vertmenu ul li a:hover {
color: #E20074;
background-color: #CCCCCC;
}
#vertmenu ul li a:focus {
color: #FFFFFF;
background-color: #000000;
border-bottom: solid 1px #000000;
}
</style>
index.html
<div id="vertmenu" align="right">
<div align="right" style="width:180px; height:10px;"></div>
<ul>
<li><a href="index.html" tabindex="1">Home</a></li>
<li><a href="#.html" tabindex="2">link2</a></li>
<li><a href="#.html" tabindex="3">link3</a></li>
<li><a href="#.html" tabindex="4">link4</a></li>
<li><a href="#.html" tabindex="5">link5</a></li>
<li><a href="#.html" tabindex="6">link6</a></li>
<li><a href="#.html" tabindex="7">link7</a></li>
<li><a href="#.html" tabindex="8">link8</a></li>
<li><a href="#.html" tabindex="9">link9</a></li>
<li><a href="#.html" tabindex="10">link10</a></li>
</ul>
</div>
Re: Aktiver Link dauerhaft hervorheben
Autor: T.Jung
Datum: 25.12.2011 14:02:45
> ich versuche es nun zum 2. Mal mit beiliegendem
> Code.
> Ergebnis ist nun, sobald ich im HTML anfange,
> echte Links zu setzen, ist der aktive Menupunkt
> nicht mehr hinterlegt.
> Beim Klick auf Link2-10 klappt es, aber bei Klick
> auf Home ist Home nicht hinterlegt. Wie bekomme
> ich das jetzt noch hin?
Wenn jetzt nicht gerade Weihnachten wäre, hätte ich nun einfach gefragt, welche Teil von »geht nicht« Du nicht verstanden hast... ;-)
So aber erkläre ich Dein Missverständnis:
Link 2 - 10 bleiben im "active"-Zustand, weil der Link nirgendwo hinführt. Es wird also keine Aktion ausgelöst und der Link bleibt »aktiv«, also selektiert. Sobald Du aber einen richtigen Link (also einen Verweis auf ein anderes Dokument) hinzufügst, wird die neue Seite geladen und der gerade angeklickte Link ist nicht mehr selektiert.
Noch einmal: Es _gibt_keinen_ CSS-Befehl, der für einen Link, der auf das Dokument (welches den Link enthält) selbst führt, zutrifft. Das, was Du machen willst, ist mit CSS allein nicht möglich; Du musst die entsprechende Klasse (wie zuvor gesagt) schon von Hand setzen oder auf eine andere Weise (etwa per PHP -- mit JavaScript ist das eventuell auch möglich, aber das kann ich jetzt nicht mit Sicherheit sagen) automatisch setzen lassen.
Frohe Weihnachten,
Tobias Jung
Re: Aktiver Link dauerhaft hervorheben
Autor: Netinja
Datum: 26.12.2011 14:59:58
> Hallo,
>
> ich versuche es nun zum 2. Mal mit beiliegendem
> Code.
> Ergebnis ist nun, sobald ich im HTML anfange,
> echte Links zu setzen, ist der aktive Menupunkt
> nicht mehr hinterlegt.
> Beim Klick auf Link2-10 klappt es, aber bei Klick
> auf Home ist Home nicht hinterlegt. Wie bekomme
> ich das jetzt noch hin?
Hallo
Guck mal in diesen Thread:
http://www.selfhtml.de/forum/zeigebeitrag_1_105021_104967_0.php
http://www.selfhtml.de/forum/zeigebeitrag_1_105134_104967_0.php
Hast du deine Navigation ausgelagert?
Stelle doch mal eine Testdatei online und poste hier den Link, wenn es bei dir immer noch nicht klappt. ;-)
LG und schöne Weihnachten
Netinja
