Michael Fritsch: css-buttons bleiben nicht activ

Hi Zusammen!

Ich brauche eine Lösung zu Buttons per css.
Wenn ein Button angeklickt ist, soll er das auch bleiben, bis ein anderer angeklickt wird.
Hier der Code, der übrigens aus selfhtml stammt: (http://aktuell.de.selfhtml.org/artikel/css/mouseover/index.htm#a2)

---snip:nav.css---
a.menu {
  display:block;
  width:180px;
  border:6px groove #99d;
  margin-top:4px;
  padding:6px;
  font-family:Arial, Verdana, sans-serif;
  font-size:80%;
  font-weight:bold;
  letter-spacing:2;
  margin-left: 5px;
}

a.menu:link    {
  color:#44a;
  background-color:#fff;
  text-decoration:none;
}
a.menu:visited {
  color:#44a;
  background-color:#fff;
  text-decoration:none;
}
a.menu:hover   {
  color:#44a;
  background-color:#ff9;
  text-decoration:none;
}
a.menu:active  {
  color:#44a;
  background-color:#ff9;
  text-decoration:none;
}

div.menu {
  color:#000;
  background-color:#ddF;
  width:100%;
  height:100%;
  text-align:center;
  padding:5px;
}
---end snip:nav.css---

---snip nav.inc.php---
      <div class="menu">
      <a class="menu" href="index.php">Home</a>
      <a class="menu" href="aktuell.php">Aktuelles</a>
      <a class="menu" href="wir.php">Wir über uns</a>
      <a class="menu" href="bilder.php">Bilderbuch</a>
      <a class="menu" href="spielplan.php">Spielplan</a>
      <a class="menu" href="kontakt.php">Kontakt</a>
      <a class="menu" href="impressum.php">Impressum</a>
      <a class="menu" href="intern.php">Intern</a><br>
      </div>
---snip nav.inc.php---

Ich habe es mit Mozilla und IE6 probiert.

Ich möchte möglicht kein Javascript verwenden!

mfg, Michael

  1. Hallo,

    Wenn ein Button angeklickt ist, soll er das auch bleiben, bis ein anderer angeklickt wird.

    Hier der Code, der übrigens aus selfhtml stammt: (http://aktuell.de.selfhtml.org/artikel/css/mouseover/index.htm#a2)

    du verwechselst da etwas:

    Die Pseudo-Klasse :active gilt, während ein Element vom Benutzer aktiviert wird. Beispielsweise könnte das zwischen den Zeitpunkten sein, wo der Benutzer die Maustaste drückt und sie wieder loslässt.
    (Siehe:
    http://www.edition-w3c.de/TR/1998/REC-CSS2-19980512/kap05.html#heading-5.11.3)

    Das du keine Javascript verwenden willst ist gut so.
    Wie ich sehe steht dir PHP zur Verfügung...
    http://www.alistapart.com/articles/keepingcurrent/

    mfg NAG

    --
    signatur
    1. Hi!

      OK, ich bin deinen Hinweisen nachgegangen, das waere eine Loesung.
      Vielen Dank!

      Doch ich bin ein neugieriger Mensch und will alles wissen ;-)

      In o.g. Beispiel in selfhtml funktioniert das was ich will auch ohne PHP!
      Wieso dort, bei mir aber nicht?

      Bitte erklaert es so, dass es ein 10-jaehriger verstehen wuerde8-)

      mfg, Michael

      1. Hi,

        In o.g. Beispiel in selfhtml funktioniert das was ich will auch ohne PHP!
        Wieso dort, bei mir aber nicht?

        Was funktioniert dort? Wie? Ich verstehe nicht, dort läuft die ganz gewöhnliche Darstellung. Habe ich etwas übersehen...?

        Bitte erklaert es so, dass es ein 10-jaehriger verstehen wuerde8-)

        Simpelste und vielleicht primitivste Möglichkeit: Du gibst dem Verweis, der hervorgehoben werden soll, eine ID (oder Klasse): class="active". Per CSS formatierst Du:

        .active {[Angaben, die anders sind]}

        Andere Möglichkeit: Du gibst jedem Verweis eine ID und machst im head die Angabe

        <style>
        <!--
        a#meinehobbies {[Angaben, die anders sind]}
        -->
        </style>

        Das formatiert den Verweis, der die ID "meinehobbies" hat, auf dieser Seite anders. Du mußt bei jeder Seite im head angeben, welcher Verweis hervorgehoben sein soll.

        Weitere Möglichkeit: Du gibst wie oben jedem Verweis eine ID. Deren CSS-Eigenschaften definierst Du aber per JavaScript (mit dem Du ausliest, auf welcher Seite Du Dich gerade befindest, um den richtigen Verweis ansteuern zu können). Nachteil: Ohne JS findet keine Unterscheidung statt.

        Beste Möglichkeit: Per Serverseitiger Skriptsprache, z.B. PHP. Wesentlich eleganter als die von nag verlinkte Methode ist eine von Jeena Paradies erläuterte: http://jeenaparadies.de/weblog/2004/mai/php-menue/

        Dort wird das Menü vollständig dynamisch generiert - Du brauchst in einer zentralen Datei lediglich Bezeichnung und Ziel zu definieren, fertig. Ich habe zufällig gerade daran gesessen und es für meine Ansprüche angepaßt.

        PHP funktioniert übrigens auch lokal und ohne laufenden Server - so lassen sich daheim fertige Dateien generieren.

        Viele Grüße,
        Bubax

        1. Hallo!

          Vielen Dank für die Info, das hat sehr geholfen!
          Meine Fragen sind somit beantwortet:-)

          tnx, Michael