Taiga UI 5.0 is out!

FloatingContainer LAYOUT

Examples API GitHub

On this page

FloatingContainer is a special container for creating different animated sticky footers

Basic

Appearing on scroll and toggling of secondary action.

Scroll to see the floating

Title
Description
Title
Description
Title
Description
Title
Description
Title
Description
Title
Description
Title
Description
Title
Description
Title
Description
Title
Description
Title
Description
Title
Description
Title
Description
Title
Description
Title
Description
Title
Description
Title
Description
Title
Description
Title
Description
Title
Description
Title
Description
Title
Description
Title
Description
Title
Description
Title
Description
Title
Description
Title
Description
Title
Description
Title
Description
Title
Description

Sheet

Using inside a SheetDialog

Text

Text block can be used together with a single button.

Title
Description
Title
Description
Title
Description
Title
Description
Title
Description
Title
Description
Title
Description
Title
Description
Title
Description
Title
Description
Title
Description
Title
Description
Title
Description
Title
Description
Title
Description
Title
Description
Title
Description
Title
Description
Title
Description
Title
Description
Title
Description
Title
Description
Title
Description
Title
Description
Title
Description
Title
Description
Title
Description
Title
Description
Title
Description
Title
Description
Legal text, max 3 lines

Content

Any kind of content can be placed inside. Use animation: none to prevent pop-in animation.

Title
Description
Title
Description
Title
Description
Title
Description
Title
Description
Title
Description
Title
Description
Title
Description
Title
Description
Title
Description
Title
Description
Title
Description
Title
Description
Title
Description
Title
Description
Title
Description
Title
Description
Title
Description
Title
Description
Title
Description
Title
Description
Title
Description
Title
Description
Title
Description
Title
Description
Title
Description
Title
Description
Title
Description
Title
Description
Title
Description

Overlay

Overlay color can be customized.

Title
Description
Title
Description
Title
Description
Title
Description
Title
Description
Title
Description
Title
Description
Title
Description
Title
Description
Title
Description
Title
Description
Title
Description
Title
Description
Title
Description
Title
Description
Title
Description
Title
Description
Title
Description
Title
Description
Title
Description
Title
Description
Title
Description
Title
Description
Title
Description
Title
Description
Title
Description
Title
Description
Title
Description
Title
Description
Title
Description

Crossfade

Using Slides to crossfade a button.

Title
Description
Title
Description
Title
Description
Title
Description
Title
Description
Title
Description
Title
Description
Title
Description
Title
Description
Title
Description
Title
Description
Title
Description
Title
Description
Title
Description
Title
Description
Title
Description
Title
Description
Title
Description
Title
Description
Title
Description
Title
Description
Title
Description
Title
Description
Title
Description
Title
Description
Title
Description
Title
Description
Title
Description
Title
Description
Title
Description
GitHub StackBlitz