Georg: Link in Navigations-Liste per CSS inaktiv schalten

Guten Morgen,

ich möchte einen Link in meiner Navigations-Liste (auf die aktuelle Seite) per CSS-Klasse inaktiv schalten (Link soll also nicht klickbar sein wie die anderen Menüpunkte). JavaScript möchte ich nicht benutzen.

Geht das?

Eigene Versuche: Das umgebende <a></a> zu löschen ist aus meiner Sicht keine günstige Option weil das Bootstrap-CSS dann nicht mehr greift - Menüpunkt springt dann bei mir nach oben weg (Bootstrap ist so vorgefertiges Rahmenwerk mit fertigen CSS-Klassen die meine Seite benutzt).

  1. Hallo Georg,

    ich möchte einen Link in meiner Navigations-Liste (auf die aktuelle Seite) per CSS-Klasse inaktiv schalten (Link soll also nicht klickbar sein wie die anderen Menüpunkte). JavaScript möchte ich nicht benutzen.

    Geht das?

    Mit CSS allein, also ohne Eingriff ins HTML geht das nicht, denn CSS weiß nicht, auf welcher Seite es ausgeführt wird.

    Eigene Versuche: Das umgebende <a></a> zu löschen ist aus meiner Sicht keine günstige Option weil das Bootstrap-CSS dann nicht mehr greift - Menüpunkt springt dann bei mir nach oben weg (Bootstrap ist so vorgefertiges Rahmenwerk mit fertigen CSS-Klassen die meine Seite benutzt).

    Du könntest das href-Attribut entfernen.

    Bis demnächst
    Matthias

    --
    Das Geheimnis des Könnens liegt im Wollen. (Giuseppe Mazzini)
    1. @@Matthias Apsel

      Du könntest das href-Attribut entfernen.

      Und evtl. stattdessen für das a-Element tabindex="0" aria-describedby="aktuelle Seite" setzen, damit der Menüpunkt bei der Tastaturnavigation weiterhin in der tab order bleibt. (Kommentar von Léonie Watson)

      Interessant auch der Gedanke von Daniel Göransson, den Link für den Menüpinkt der aktuellen Seite auf den Anker des Hauptinhalts zeigen zu lassen.

      LLAP 🖖

      --
      „Wir haben deinen numidischen Schreiber aufgegriffen, o Syndicus.“
      „Hat auf dem Forum herumgelungert …“
      (Wachen in Asterix 36: Der Papyrus des Cäsar)
  2. Hej Georg,

    Guten Morgen,

    ich möchte einen Link in meiner Navigations-Liste (auf die aktuelle Seite) per CSS-Klasse inaktiv schalten

    Das umgebende <a></a> zu löschen ist aus meiner Sicht keine günstige Option weil das Bootstrap-CSS dann nicht mehr greift

    Da ich Bootstrap nicht verwende: vielleicht sieht Bootstrap für solche Fälle ein Element (strong span oder so) mit einer bestimmten Klasse vor. Eventuell auch ein a ohne href (idealereweise so umgesetzt wie von @@Gunnar beschrieben) mit der entsprechenden von Bootstrap für "inaktive Links" vorgesehenen Klasse.

    Da müsstes du selber mal in der sehr ausführlichen und guten Bootstrap-Doku nachschauen.

    Ansonsten ein kleiner Seitenhieb in Richtung Bootstrap: selber machen, macht klug ;-)

    Marc

    1. Hallo marctrix,

      @@Gunnar

      Notifications funktionieren mit nur einem @, @marctrix.

      Bis demnächst
      Matthias

      --
      Das Geheimnis des Könnens liegt im Wollen. (Giuseppe Mazzini)
      1. Hej Matthias,

        @@Gunnar

        Notifications funktionieren mit nur einem @, @marctrix.

        Ist angekommen, danke! ;-)

        Reicht es denn Gunnar Bittersmann oder @Matthias Apsel mit dem Vornamen zu notifizieren? Oder braucht man den vollen Namen, womöglich noch in Anführungsstrichen?

        He! - jetzt habe ich (zum ersten Mal) ein Dropdown bekomme - liegt wohl an dem einfachen @ ... - was meine Frage auch gleich beantworte und unsere Unterhaltung mal wieder zum Selbstgespräch verkommen lässt.

        Wir sind dann mal weg... ;-)

        Marc