Navigation

Sliding segment tabs

Ein pillenförmiges, segmentiertes Steuerelement, dessen Hintergrundanzeige unter der aktiven Beschriftung gleitet, während das Feld darunter aus der Fahrtrichtung hineingleitet.

Northline workspace is on the Growth plan with 18 seats filled and 4 invites pending. Storage sits at 62% of the 500 GB allowance.

Sliding segment tabs verwenden

Ein pillenförmiges, segmentiertes Steuerelement, dessen Hintergrundanzeige unter der aktiven Beschriftung gleitet, während das Feld darunter aus der Fahrtrichtung hineingleitet.

Teste die Vorschau mit Maus und Tastatur. Prüfe den sichtbaren Fokus und das Layout auf schmalen Bildschirmen in deiner eigenen Seite. Nenne deinem Agenten die Nummer oder den Bezeichner, um diese Komponente abzurufen.

Eigenschaften: accentColor, segments, transitionSpeed, defaultIndex

Welche Frameworks sind verfügbar?

Der Katalog enthält diese Versionen: react, vue, svelte, astro, html. Die Vorschau auf dieser Seite verwendet React.

Wie greife ich auf die Implementierung zu?

Vorschau und Beschreibung sind öffentlich. Melde dich mit einem berechtigten Konto an, um Code, Framework-Versionen und Installation zu öffnen.

Verbinde deinen Agenten

Ähnliche Komponenten

1986Keyboard pill tabsNavigationEin Zwei-Tab-Umschalter mit einer Pillenmarkierung, die zwischen Beschriftungen gleitet, und vollständiger Tastaturnavigation mit beweglichem Fokus zwischen den Tabs.

2399Panel Tab SwitcherNavigationEine abgerundete Tab-Leiste, in der sich ein Hintergrundindikator an die exakte Größe und Position des aktiven Tabs anpasst und einen deutlichen Inhaltsbereich darunter freigibt.

2044Sliding Panel TabsNavigationZwei Registerkarten in einer abgerundeten Pillenspur mit einer Hervorhebung, die dazwischen gleitet und ein darunter liegendes Bedienfeld im Einstellungsstil überblendet, ohne dass es zu einem Layoutsprung kommt.

2046Sliding Selection HighlightNavigationEin gemeinsamer schwebender Hintergrundchip, der innerhalb einer Reihe von Optionen von einem Element zum anderen gleitet und verfolgt, welches Element mit der Maus bewegt oder angeklickt wird.

1914ARIA Tablist ResizeNavigationEine vollständig zugängliche Roving-Tabindex-Tab-Liste mit einer gleitenden Pillen-Hervorhebung, bei der sich die Größe des Bedienfeldrahmens nahtlos an den angezeigten Tab-Inhalt anpasst.

1916Auto height tabsNavigationEine Registerkartengruppe, deren Inhaltscontainer beim Wechseln der Registerkarten die Höhe stufenlos an die Größe jedes Panels anpasst, anstatt zu springen oder leeren Raum zu hinterlassen.