Header header
Layout-Baustein für den Seitenkopf: Logo-Slot, Navigation, ein CTA. Unterhalb von md übernimmt ein natives<details>-Burger-Menü – ganz ohne JavaScript. Beide Header hier sind Demonstrationsobjekte im Katalog-Inhalt.
Variante: sticky=false (Default) · „Leistungen" trägt Kind-Einträge und wird zum Dropdown – öffnet am Desktop per Hover (Maus, mit Schließ-Verzögerung), per Klick/Enter und Fokus (ESC schließt), mobil als Accordion; das Panel sitzt bündig unter der Nav. Fenster unter md verkleinern, um das Burger-Menü zu sehen
Variante: sticky · im Scrollcontainer demonstriert – beim Scrollen bleibt der Header oben stehen, mit geblurter, halbtransparenter Fläche
Scrollen Sie in diesem Rahmen: Der Header bleibt oben stehen, während der Inhalt darunter durchläuft.
Seit 1962 fertigt die Schreinerei Lindner Möbel, Türen und Einbauten aus heimischem Holz. Drei Generationen, eine Werkstatt in Fürth, ein Anspruch: Handwerk, das seine Besitzer überdauert.
Vom ersten Aufmaß bis zur Montage bleibt jedes Projekt in einer Hand. Wir planen am Objekt, bauen in der eigenen Werkstatt und montieren mit dem eigenen Team – termintreu und zum Festpreis.
Ob Einbauschrank unter der Dachschräge, Empfangstresen für die Kanzlei oder die Restaurierung eines Erbstücks: Erzählen Sie uns, was entstehen soll. Wir melden uns innerhalb von zwei Werktagen.
Unsere Werkstatt können Sie jeden ersten Samstag im Monat besichtigen – Hobelbank, Furnierpresse und Lager inklusive. Eine kurze Anmeldung genügt.
Variante: transparent · legt sich über den folgenden Hero (Ruhezustand mit dezentem Verlaufs-Scrim; beim Scrollen wechselt er auf eine geblurte Fläche – das Verhalten bindet an den Seiten-Scroll)
Der Header liegt auf dem Hero – keine eigene Zeile, kein Rahmen.
Variante: sticky="auto-hide" · versteckt sich beim Runterscrollen, kommt bei der ersten Aufwärtsbewegung zurück (bindet an den Seiten-Scroll; ohne JavaScript verhält er sich wiesticky). Tastatur-Fokus holt einen versteckten Header immer zurück.