LinkBack URL
About LinkBacks
Zitierender Zustand "active" tut leider nicht das, was man denkt, und ist zur "Markierung" der gerade angezeigten Seite ungeeignet. Ich vergebe da meist eine eigene Klasse für den betreffenden Link, oder arbeite mit einer Kombi aus body- und link-id ..
Hallo Leute,
eigentlich will ich was relativ Einfaches - so dachte ich.
Button:
link Border weiss - Schrift grau - Hintergrund weiss
hover Border weiss - Schrift grau - Hintergrund weiss
avtive Border rot - Schrift weiss - Hintergrund rot
Sieht nicht kompliziert aus, dachte ich. Aber wenn ich die Maus auf dem Button loslasse, bekomme ich den hover Hintergrund, möchte aber gerne den active Hintergrund.
Und den bekomme ich nur wenn ich die Maus ausserhalb des Buttons loslasse.
Lässt sich das ändern? - Wenn ja wie?
Ich danke Euch.Code:#nav ul a:link { border: 1px solid #FFFFFF; color:#777; background:#fff; } #nav ul a:visited { color:#888; } #nav ul a:focus{ border:1px solid red; background:#FC761D; color:white; } #nav ul a:hover { border:1px solid red; color:#FC761D; background:#fff; } #nav ul a:active { border:1px solid red; color:white; background:#FC761D; box-shadow: 10px 10px 22px #ffA073; -webkit-box-shadow: 10px 10px 22px #ffA073; -moz-box-shadow: 10px 10px 22px #ffA073; }
Grüße
E.
der Zustand "active" tut leider nicht das, was man denkt, und ist zur "Markierung" der gerade angezeigten Seite ungeeignet. Ich vergebe da meist eine eigene Klasse für den betreffenden Link, oder arbeite mit einer Kombi aus body- und link-id ..
zeig mal ?
so zum Beispiel:
hat den Nachteil, daß das Menü auf jeder Seite etwas anders aussieht.HTML-Code:<ul> <li><a href="http://www.traum-projekt.com/forum/34-html-and-css/...">Seite 1</a></li> <li><a href="http://www.traum-projekt.com/forum/34-html-and-css/..." class="current">Seite 2 - gerade aktiv</a></li> </ul>
Alternativ vergebe ich schonmal body- und link-ids und frage per css die Kombination ab:
im css wird das dann hintereinander gehängt:HTML-Code:<body id="seite2"> <ul> <li><a href="http://www.traum-projekt.com/forum/34-html-and-css/..." id="linkSeite1">Seite 1</a></li> <li><a href="http://www.traum-projekt.com/forum/34-html-and-css/..." id="linkSeite2">Seite 2</a></li> <li><a href="http://www.traum-projekt.com/forum/34-html-and-css/..." id="linkSeite3">Seite 3</a></li> </ul>
... da bleibt das menu auf jeder Seite gleich, aber man muss jeweils die body-id anpassen ..Code:a {normale Ansicht} body#seite1 a#linkSeite1, body#seite2 a#linkSeite2, body#seite3 a#linkSeite3 {aktive Ansicht}
Boej das ist aber aufwendig ;-) - danketrotzdem.
E.
Japp, ich fände es auch schöner, wenn das automatisch ginge.. aber mit reinem HTML/CSS meines Wissens nicht zu machen ..
http://www.ohne-css.gehts-gar.net/0016.php
Oder du verwendest für die jeweils geöffnete Seite keinen Link und definierst das Format mit einer span class.
Hier die Lösung derer ich mich gerne bediene:
Irgendwo auf der Seite (oder von extern herholen) musst etwas wie das einbauen:
dannach rufst du Seiten etwa so auf:PHP-Code:<?php
switch(intval($_GET['id']))
{
case 1: $pageCall = 'seite1'; break;
case 2: $pageCall = 'seite2'; break;
default: $pageCall = 'home';
}
?>
und nat. das css nicht vergessen:PHP-Code:<a href="<?php echo $_SERVER['PHP_SELF']; ?>?id=1" class="menu" id="<?php echo ($_GET['id'] == '1') ? 'menuactive1': 'menunormal1'; ?>">Seite1</a>
<a href="<?php echo $_SERVER['PHP_SELF']; ?>?id=2" class="menu" id="<?php echo ($_GET['id'] == '2') ? 'menuactive2': 'menunormal2'; ?>">Seite2</a>
so oder so ähnlich sollte es klappen... ich hoffe es hat sich in der Eile kein Fehler eingeschlichen ...Code:.menu a#menunormal1, a#menunormal2 ... { color:#000; text-decoration:none; ... } .menu a#menunormal1:hover, a#menunormal2:hover, a#menuactive1, a#menuactive2 ... { color:#f00; text-decoration:underline; ... }
mfg fiu
edit: habe doch was veressen... ganz wichtig:
Achja ... In der Adressleiste des Browsers sieht das dann in etwa so aus:PHP-Code:<body id="<?php echo $pageCall; ?>">
http://example.com/seite.php?id=1
Geändert von fiu (29.09.2010 um 17:04 Uhr)
Aktive Benutzer in diesem Thema: 1 (Registrierte Benutzer: 0, Gäste: 1)