li ul active Problem

aphix · 24.11.2006, 13:05

Hallo, ich weiß, war schon hundert mal da, aber ich find einfach nix!

HAb ein Problem mit activ und wollte mal die Profis fragen !

Ich hab den activ status immer so umgesetzt:

Code:

<?php $thisPage="Startseite"; ?>

Im Menü:

Code:

<li <?php if ($thisPage=="Startseite") 
      echo " id=\"currentpage\""; ?>>  <a href="index.php">Home</a></li>

Funktioniert auch prima.
Jetzt hab ich mir ein neues Menu geschustert, siehe Bild.

Hier noch der CSS active Code:

Code:

#Navigation li a.current {
 background-color: #F0F0EC;
 color: #000000;
 font-weight:bold;
 margin: -1px 0px -1px 0px;
 padding: 5px 0px 4px 16px;
 background-image: url(mactive.gif);
}
#Navigation ul  a.current {
 background-color: #fff;
 color: #000000;
 margin: 0px;
 padding: 4px 0px 3px 16px;
 background-image: url(mactive.gif);
}

Ich bekomm die Links einfach nicht active!

Wenn ich aber "class="current" bei dem jeweiligen Link reinschreib, tut er es.
Mit der php Version passiert nichts !

Ich wollte auch, wenn man auf z.B. Netzwerke klickt, gleichzeitig Leistungen auch activ ist!

Ich bin echt ein php Noob, ich hoffe ihr könnt mir helfen!

aphix

321 · 24.11.2006, 15:48

Ich habs so:
CSS

Code:

#navigation ul li a
{
	display: block;
	width: 175px;
	height: 24px;
	text-decoration: none;
	font-size: 12px;
	font-weight: bold;
	color: #000099;
	background: url(img/Navi-signale.jpg) 0 -0px no-repeat;
	padding-left: 12px;
}

#navigation ul li a:hover
{
	background-position: 0 -24px;
}

#navigation ul li a.aktiv
{
	text-decoration: none;
	background-position: 0 -48px;
}

PHP/HTML (bei jeder Menu-Position

PHP-Code:


			
// Der Link der aktuellen Seite wird der class "aktiv" zugewiesen

$klasse = (($thePage == 'willkommen') ? 'class="aktiv" ' : ' ');  

echo     '<li><a '.$klasse. ' href="index.php?willkommen"

    title=" zur Homepage ">Willkommen</a></li>'."\n";

aktiv oder current ist ja egal

rewboss · 24.11.2006, 16:49

Ja, "aktiv" oder "current" ist egal, weil beides falsch ist. Es heißt: "active".

aphix · 24.11.2006, 16:53

Hab es soweit!

Code:

#Navigation #current a{
 background-color: #F0F0EC;
 color: #000000;
 font-weight:bold;
 margin: -1px 0px -1px 0px;
 padding: 5px 0px 4px 16px;
 background-image: url(mactive.gif);
}
#Navigation #current2 a{
 background-color: #fff;
 color: #000000;
 margin: 0px;
 padding: 4px 0px 3px 16px;
 background-image: url(mactive.gif);
  font-weight:bold;
}

Code:

<li  ><a href="#" >Home</a></li>
  
  <li <?php if ($thisPage=="Leistungen") echo " id=\"current\""; ?> ><a href="#" >Leistungen</a><ul>
      <li ><a  href="#">Hardware</a></li>
      <li><a href="#">Netzwerke</a></li>
<li <?php if ($thisPage=="Leistungen") echo " id=\"current2\""; ?> > <a   href="#" >Sicherheit</a></li>
      <li><a  href="#" >Support</a></li>
      <li><a  href="#" >Wartung</a></li>
       <li><a href="#" >Pflege</a></li>
    </ul>
  </li>

Ich will ja das beide Punkte aktiv sind! Leistungen und z.B. Sicherheit.
Sind sie jetzt auch.

Leider sind jetzt alle Punkte unter "Leistungen" auch aktiv.
Gibt es da ne Möglichkeit, das zu unterdrücken!?

Ich möchte ja, das Leistungen immer aktiv ist, wenn ich einen Unterpunkt anklicke, kann ich da ne abfrage reinbauen?
So in etwa!?:

<li <?php if ($thisPage=="Leistungen oder Sicherheit oder Wartung") echo " id=\"current\""; ?> ><a href="#" >Leistungen</a><ul>

Ich hoffe, es ist noch verständlich !

aphix

321 · 24.11.2006, 17:17

Zitat:

Zitat von rewboss

Ja, "aktiv" oder "current" ist egal, weil beides falsch ist. Es heißt: "active".

Es ist mir auch klar, dass das keine Pseudo-Klassen sind.
Man könnte es auch "aktuell" oder "sonstwas" nennen, denn damit soll der aktive, aktuell angezeigte Menu-Punkt hervorgehoben werden und nicht der "active Link" was nur während des Klickens kurz der Fall ist. Den könnte man ja mit blossem CSS auszeichnen und bräuchte dazu keine Abfragen im PHP.

aphix · 24.11.2006, 17:20

Nicht streiten !

321 · 24.11.2006, 17:36

Das sah ich erst gar nicht, dass du verschachtelte Listen hast.
Dann musst Du die Abfrage auf "Leistungen" eben bei allen Unterpunkten machen.

Ausserdem siehst Du in meinem Beispiel, dass nur dem Link, also dem <a> diese Klasse zugeteilt wird und dass im CSS nur für a die Klasse "aktiv" existiert.

Warum machst es immer noch mit Id. wenn das doch scheinbar nicht funktioniert, wie Du sagst.

ps: Mein Beispiel läuft und ist im Einsatz.

aphix · 24.11.2006, 17:45

So wie oben zu sehen, läuft es aber.

#Navigation #current a{

Damit Leistungen immer aktiv ist, hab ich so "gelöst":

($thisPage=="Leistungen" or $thisPage=="Sicherheit") echo

Weiß nicht, ob das die feine Englische ist, aber es funktioniert.

Jetzt hab ich noch das Problem, das alle Menüpunkte (außer dem aktiven "Sicherheit"), so aussehen wie Leistungen.

Da noch ne Idee!?

321 · 24.11.2006, 18:14

Warum ausser? Gemäss Screenshot sehen alle Unterpunkte von "Leistungen" gleich aus.

Wenn Du so vorgehst:

($thisPage=="Leistungen" AND $thisPage=="Hardware") echo
($thisPage=="Leistungen" AND $thisPage=="Netzwerke") echo
($thisPage=="Leistungen" AND $thisPage=="Sicherheit") echo
($thisPage=="Leistungen" AND $thisPage=="Support") echo
($thisPage=="Leistungen" AND $thisPage=="Wartung") echo
($thisPage=="Leistungen" AND $thisPage=="Pflege") echo

wird Leistungen und der EINE Unterpunkt betroffen sein.

Deine OR-Bedingung trifft immer zu, wenn "Leistungen" zutrifft!

rewboss · 24.11.2006, 18:25

Zitat:

Zitat von 321

Es ist mir auch klar, dass das keine Pseudo-Klassen sind.

...hab den Code nicht richtig gelesen...

*brillenaufsetz*

aphix · 24.11.2006, 18:30

Zitat:

Zitat von 321

Warum ausser? Gemäss Screenshot sehen alle Unterpunkte von "Leistungen" gleich aus.

Leistungen soll Fett und grauen BG haben.
Sicherheit auch Fett und weißen BG.

Bei Sicherheit gehts ja, aber die anderen inaktiven Punkte, sind auch alle Fett und haben den grauen BG, der nur bei Leistungen zu sehen sein soll.

Das mit or hab ich gemacht, damit Leistungen auf jeden Fall aktiv ist, wenn ein "Leistungen" Unterpunkt aufgerufen wurde.

Ich sag der Seite mit z.B. $thisPage=="Sicherheit" wie sie "heißt" und der Link Leistungen "schaut" nach, ob für ihn was bei ist, wenn nicht, bleibt er inaktiv!

Ich bekomm nur nicht raus, warum die anderen Links die "Leistungen" Formatierung übernehmen!?

Ich glaub das ist alles zu hoch für mich !

321 · 24.11.2006, 19:26

Ich weiss ja nicht, was hinter Deinen "echo" noch so steht, wo Du es nicht postest.
Zeige doch mal den GANZEN Code: Script und CSS
dann blickt man besser durch.

321 · 24.11.2006, 19:27

Zitat:

Zitat von aphix

Nicht streiten !

Wir streiten? Ne ne, des brauch ma zum Lebe!

aphix · 24.11.2006, 19:40

Okeli, hier erst mal mein CSS zum Menü:

Code:

#menu {
background-color:#000;
width: 150px;
 padding: 0px;
 margin: 10px 0px 0px 10px;
 float: left;
 text-align: left;
}

#Navigation {
 list-style-type: none;
 margin: 0px;
 padding: 0px 1px 0px 0px;
 /* oben, rechts,unten,links*/}
 
 #Navigation li {
 margin: 2px 0px 2px 0px;
 padding: 0px;
}

#Navigation li a {
 background-color: #FFFFFF;
 color: #000000;
 display: block;
 text-decoration: none;
 padding: 5px 0px 3px 22px;
 background-image: url(inactive.gif);
 background-repeat: no-repeat;
 background-position: left;
 margin: -1px 0px -1px 0px;
}

#Navigation li a:hover {
 color: #006699;
 background-color: #FFFFFF;
}

#Navigation li ul {
 list-style-type: none;
 background-color: #FFFFFF;
 color: #000000;
 margin: 0px;
 padding: 0px;
}

#Navigation li ul li {
 margin: 0px 0px 2px 5px;
 padding: 0px;
}

#Navigation li ul li a {
 display: block;
 text-decoration: none;
 background-image: none;
}
#Navigation #active  a{
 background-color: #F0F0EC;
 color: #000000;
 font-weight:bold;
 margin: -1px 0px -1px 0px;
 padding: 5px 0px 4px 16px;
 background-image: url(mactive.gif);
}
#Navigation #active2  a{
 background-color: #fff;
 color: #000000;
 margin: 0px;
 padding: 4px 0px 3px 16px;
 background-image: url(mactive.gif);
  font-weight:bold;
}

Hier das Menü-html:

Code:

<div id="menu">

        <ul id="Navigation">
        
  <li  ><a href="#" >Home</a></li>
  
  <li <?php if ($thisPage=="Leistungen" or $thisPage=="Sicherheit") echo " id=\"active\""; ?> ><a href="#" >Leistungen</a><ul> 

      <li ><a  href="#">Hardware</a></li>
      <li><a href="#">Netzwerke</a></li>
<li <?php if ($thisPage=="Sicherheit") echo " id=\"active1\""; ?> > <a   href="#" >Sicherheit</a></li>
      <li><a  href="#" >Support</a></li>
      <li><a  href="#" >Wartung</a></li>
       <li><a href="#" >Pflege</a></li>
   </ul>
  </li>
  <li><a  href="#">Referenzen</a></li>
  
  
  <li><a  href="#" >Service</a><ul>
      <li><a  href="#" >Downloads</a></li>
<li><a href="#" >Links</a></li>
      </ul>
  </li>
  <li><a href="#" >Kontakt</a></li>
  <li><a href="#" >Impressum</a></li>
</ul>
  

    </div>

Oben steht dann noch: <?php $thisPage="Sicherheit"; ?>

321 · 24.11.2006, 21:05

CSS:
Ich finde es eindeutiger und übersichtlicher eine Klasse statt einer zweiten Id zu verwenden.

Code:
Ist es denn nicht so, dass bei JEDEM Unterpunkt von "Leistungen"
der Unterpunkt und "Leistungen" als aktiv erscheinen sollen?
Du hast den Test nur bei "Sicherheit" gemacht, nicht aber bei Hardware, Netzwerke, Support, Wartung und Pflege.

PHP-Code:


			
<li <?php if ($thisPage=="Leistungen" or $thisPage=="Sicherheit") 

  echo " id=\"active\""; ?> ><a href="#" >Leistungen</a><ul> 



      <li ><a  href="#">Hardware</a></li>

      <li><a href="#">Netzwerke</a></li>

<li <?php if ($thisPage=="Sicherheit") echo " id=\"active1\""; ?> > <a   href="#" >Sicherheit</a></li>

      <li><a  href="#" >Support</a></li>

      <li><a  href="#" >Wartung</a></li>

       <li><a href="#" >Pflege</a></li>

   </ul>

  </li>