zurück zur Startseite
  


Zurück XHTMLforum > (X)HTML und CSS > CSS
Seite neu laden separate navigation > css > aktiver Link?

Antwort
 
LinkBack Themen-Optionen Ansicht
  #1 (permalink)  
Alt 14.08.2006, 12:11
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 14.08.2006
Beiträge: 10
lohroli befindet sich auf einem aufstrebenden Ast
Standard separate navigation > css > aktiver Link?

Hallo

bei http://www.thestyleworks.de/tut-art/listnav2.shtml

wird wunderbar gezeigt, wie man Listen-Navigationen erstellen kann. Insbesondere auch, wie man es anstellt, damit der aktive Link in der Navigation angezeigt wird.

Mein Problem ist jetzt aber, dass ich meine Navigation in einer separaten Datei haben möchte und auf allen Seiten einbinde. Ich will die Navigationsänderungen ja nicht jedesmal auf allen Seiten ändern!

Frage: gibt es trotzdem mit css eine Möglichkeit, den Link aus so aktiv anzuzeigen? Oder muss man das anders machen? Mit Javascript?

Danke für Eure Tipps!
Oli
Mit Zitat antworten
Sponsored Links
  #2 (permalink)  
Alt 14.08.2006, 12:42
Neuer Benutzer
neuer user
 
Registriert seit: 01.02.2006
Beiträge: 10
optimax befindet sich auf einem aufstrebenden Ast
Standard

hi,

wenn ich das alles richtig verstehe hasst du das gleiche Problem wie in dem Beitrag hier, vielleicht kommt ja auch die gleiche Lösung in Frage.

CSS Menü auslagern
Mit Zitat antworten
Sponsored Links
  #3 (permalink)  
Alt 14.08.2006, 13:29
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 14.08.2006
Beiträge: 10
lohroli befindet sich auf einem aufstrebenden Ast
Standard

Hallo

ja, danke, das könnte es sein! Ich versuch es mal aus...

Gruss
Oliver
Mit Zitat antworten
  #4 (permalink)  
Alt 14.08.2006, 14:06
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 14.08.2006
Beiträge: 10
lohroli befindet sich auf einem aufstrebenden Ast
Standard

Hat es bei Dir geklappt? Bei mir nicht. Hier mal den Code der hmt-Datei und die css-Infos:

...................

1. Testdatei
Code:
<body>
<?php
include('testnav.php');
?>

<br /><br /><br /><br /><br /><br /><br /><br />


Seite 1

</body>
...................

2. Navigation

Code:
<div id="navigation">
<ul>
<li<? if ($nav == 1) echo " class='aktiv'"; ?>><a href="test1.php">Test1</a></li>
<li<? if ($nav == 1) echo " class='aktiv'"; ?>><a href="test2.php">Test2</a></li>
<li><a href="">xx</a></li>
<li><a href="">yy</a></li>
</ul>
</div>
....................

3. die css-Datei

Code:
body {
   font-size: 15px;
   color: #000;
   background-color: #393;
   padding: 0;
   margin: 0;
   }

#maincontent {
   background-color: #f6ffff;
   padding: 1em;
   border-left: 1px solid #909;
   margin: 0 0 0 174px;
   }

#navigation {
   position: absolute;
   top: 7px;
   left: 7px;
   }
 
#navigation ul {
   padding: 0;
   margin: 0;
   }
 
#navigation li {
   padding: 0;
   margin: 0;
   list-style: none;
   width: 168px;
   }
   
#navigation li a {
   background-color:#FF9900;
   }

#navigation li a:hover, #navigation  li a.aktiv {
   background-color:#99FF66;
   }
	
#navigation a {
   font: bold 1em sans-serif;
   text-decoration: none;
   display:block;
   padding: 3px 4px;
   border: 1px solid #909;
   margin: 2px 0 0 10px;
   width: 148px;
   }
Wo liegt der Haken?

Danke für die Hilfe!
Oliver
Mit Zitat antworten
  #5 (permalink)  
Alt 14.08.2006, 14:17
Benutzerbild von daro
CSS-GrandmasterJediKnight
XHTMLforum-Mitglied
 
Registriert seit: 31.01.2006
Ort: Coruscant
Beiträge: 101
daro befindet sich auf einem aufstrebenden Ast
Standard

es gibt da auch eine einfachere möglichkeit:

dem body und den einzelnen menüpunkten eine id zuweisen, wobei der body immer eine zur aktuellen seite/sektion/etc passende hat

z.B.:
HTML
Code:
<body id="test2">
<ul>
  <li id="menu_test1">....</li>
  <li id="menu_test2">....</li>
  <li id="menu_test3">....</li>
</ul>
</body>
CSS:
Code:
body#test1 #menu_test1 {
   background-color:#99FF66;
}
body#test2 #menu_test2 {
   background-color:#99FF66;
}
body#test3 #menu_test3 {
   background-color:#99FF66;
}
__________________
Use the Force!

Mein Last.fm Profil
Mit Zitat antworten
  #6 (permalink)  
Alt 14.08.2006, 14:17
Benutzer
neuer user
 
Registriert seit: 26.02.2006
Beiträge: 53
chincher befindet sich auf einem aufstrebenden Ast
Standard

du musst die $nav auch mit inhalt füllen wie mit index.php?nav=1
Mit Zitat antworten
  #7 (permalink)  
Alt 14.08.2006, 14:53
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 14.08.2006
Beiträge: 10
lohroli befindet sich auf einem aufstrebenden Ast
Standard

Zitat:
Zitat von daro
es gibt da auch eine einfachere möglichkeit:

dem body und den einzelnen menüpunkten eine id zuweisen, wobei der body immer eine zur aktuellen seite/sektion/etc passende hat

z.B.:
HTML
Code:
<body id="test2">
<ul>
  <li id="menu_test1">....</li>
  <li id="menu_test2">....</li>
  <li id="menu_test3">....</li>
</ul>
</body>
CSS:
Code:
body#test1 #menu_test1 {
   background-color:#99FF66;
}
body#test2 #menu_test2 {
   background-color:#99FF66;
}
body#test3 #menu_test3 {
   background-color:#99FF66;
}
danke für den Tipp! Allerdings möchte ich die Navigation auslagern, weil ich diese, wenn ich sie mal ändere (ich meine die Links oder weil ich sie erweitere) nicht auf jeder Seite erweitern möchte.

Von daher geht dieser Vorschlag von Dir nicht oder?
Mit Zitat antworten
  #8 (permalink)  
Alt 14.08.2006, 14:54
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 14.08.2006
Beiträge: 10
lohroli befindet sich auf einem aufstrebenden Ast
Standard

ich hab nicht verstanden wie Du das meinst. Kannst Du mir ein Beispiel machen. Vermutlich ist das aber der richtige Weg - via $php...

Danke für die Hilfe!
Mit Zitat antworten
  #9 (permalink)  
Alt 14.08.2006, 15:28
Neuer Benutzer
neuer user
 
Registriert seit: 01.02.2006
Beiträge: 10
optimax befindet sich auf einem aufstrebenden Ast
Standard

Am einfachsten machst du es, wenn du die navigation per php includest und auf jeder Seite dann eine andere Zahl an die Variable xyz übergibst.

Z.b.
html file, an der stelle wo das menü erscheinen soll
Code:
<?php
$menu = 2;

include('testnav.php');
?>
menu.inc
Code:
<div id="navigation">
<ul>
<li<? if ($nav == 1) echo " class='aktiv'"; ?>><a href="test1.php">Test1</a></li>
<li<? if ($nav == 2) echo " class='aktiv'"; ?>><a href="test2.php">Test2</a></li>
<li><a href="">xx</a></li>
<li><a href="">yy</a></li>
</ul>
</div>
In diesem Fall wäre der Link "Test 2" aktiv da "menu = 2" gesetzt wurde bevor das menu per include eingebunden wird. (unter der voraussetzung es gibt ne klasse die aktiv heisst )

Hoffe damit kommst etwas weiter.

Geändert von optimax (14.08.2006 um 15:31 Uhr)
Mit Zitat antworten
Sponsored Links
  #10 (permalink)  
Alt 14.08.2006, 15:59
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 14.08.2006
Beiträge: 10
lohroli befindet sich auf einem aufstrebenden Ast
Standard

Hallo Optimax

perfekt!

Vielen Dank
Oliver
Mit Zitat antworten
Sponsored Links
Antwort

Themen-Optionen
Ansicht

Forumregeln
Es ist Ihnen nicht erlaubt, neue Themen zu verfassen.
Es ist Ihnen nicht erlaubt, auf Beiträge zu antworten.
Es ist Ihnen nicht erlaubt, Anhänge hochzuladen.
Es ist Ihnen nicht erlaubt, Ihre Beiträge zu bearbeiten.

BB-Code ist an.
Smileys sind an.
[IMG] Code ist an.
HTML-Code ist aus.
Trackbacks are an
Pingbacks are an
Refbacks are aus


Ähnliche Themen
Thema Autor Forum Antworten Letzter Beitrag
CSS Navigation - Aktuellen Link hervorheben? citrus CSS 7 21.02.2013 23:53
Ausrichtung Kalender greece4u CSS 20 14.05.2012 14:32
Animated Navigation with CSS & jQuery (Problem) Softice CSS 1 15.10.2011 21:46
Navigation ist nicht mittig Schokokrapfen CSS 29 20.09.2011 00:19
Problem mit Navigation safari CSS 12 20.04.2011 12:11


Alle Zeitangaben in WEZ +2. Es ist jetzt 21:48 Uhr.