You are using Internet Explorer 11 or earlier, this browser is no longer supported by this website. We suggest to use a modern browser.

UCP Pattern Library
UCP Pattern Library
UCP Pattern LibraryUCP Pattern LibraryUCP Pattern Library
  • English
  • Pattern Library
  • flexible
    • English
  • Startseite
  • Pattern nach Typus
  • Navigation
  • Anchor Navigation - sticky (07_19)

Anchor Navigation - sticky (07_19)

Das „Anchor Navigation (sticky)" Modul zeigt eine blaue Navigationsleiste in Full-width an, in welcher Links zu den einzelnen Abschnitten auf einer Seite gesetzt werden können. Der Nutzer hat hierdurch die Möglichkeit zu einer bestimmten Stelle auf der Seite zu springen. Abgesehen von der unterschiedlichen Gestaltung unterscheidet sich dieses Modul zum Modul "Anchor Links (Dropdown)" zustätzlich durch die Tatsache, dass es immer sichtbar ist (sticky).

Beispiel Seitenansicht

Das Modul ist orange markiert

Anchor Navigation (sticky) - Modulansicht

Anchor Navigation (sticky) im Bühnenbereich einer Seite

So funktioniert das Modul

Um die Ankernavigation anzuzeigen, müssen lediglich die entsprechenden Module der aktuellen Seite ausgewählt werden. Die Bezeichnung eines Ankerlinks lässt sich via Doppelklick auf diesen ändern.

Hinweis: Die Ankernavigation aktualisiert sich nicht beim Hinzufügen neuer Module.

Das Modul kann in den folgenden Seitenbereichen und Templates verwendet werden:

Startpage
stage
content
Content Page
stage
main content
right
bottom
Flexible Layout
full-width
default
default with sidebar right
sidebar
sidebar
default with sidebar left
Der blaue Bereich gibt an, dass das Modul in dieser Content Area anwendbar ist.

Das Modul kann in folgenden Themes eingesetzt werden:

  • Internet
  • Intranet
  • Suite
Der blaue Bereich gibt an, dass das Modul in diesem Theme anwendbar ist.

So sieht das Modul aus

Anchor Navigation - sticky (07_19)

Beispielseite

arrow-down UCP Pattern Library

  • brandfactory
  • media pool - das Digital Asset Management System für thyssenkrupp
  • CMS Login

Folgen Sie uns

  • Global Corporate Website
© thyssenkrupp AG 2023
  • Sitemap
  • Impressum
  • Rechtliche Hinweise
  • Teilen tk-share
    FacebookTwitter Email LinkedIn