Überlagerungen

Thumbnail-to-video lightbox

Ein Video-Miniaturbild mit einer Wiedergabeschaltfläche, die einen enthaltenen Leuchtkasten öffnet, wobei das Videofeld aus einer ausgewählten Richtung vor einem unscharfen, abgedunkelten Hintergrund eintrifft.

Thumbnail-to-video lightbox verwenden

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: animationStyle, accent, thumbnailLabel

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

1919Banner header dialogÜberlagerungenEin modales Fenster mit einem farbigen Bannerstreifen am oberen Rand, das sich über einer abgeblendeten und völlig inaktiven Kopie der Seite dahinter befindet.

2324Confirm action modalÜberlagerungenEin zentrierter Bestätigungsdialog, der sich über einem dunkler werdenden Hintergrund öffnet und den Besucher auffordert, eine destruktive Aktion zu bestätigen oder abzubrechen.

1948Custom shell lightboxÜberlagerungenEin Galerieraster, das einen randlosen, vollflächigen Leuchtkasten öffnet und zeigt, wie eine einzige Öffnungs-, Schließ- und Fokus-Engine eine völlig individuelle Hülle tragen kann.

2335Dismissible DialogÜberlagerungenEin universeller zentrierter Dialog, der vor einem unscharfen Hintergrund geöffnet wird und durch die Schaltfläche „Schließen“, den Hintergrund oder Escape einfach geschlossen werden kann.

2419Scrollable modal dialogÜberlagerungenEin allgemeines Modal mit einer Kopfzeile, einem Textkörper, der unabhängig scrollt, sobald sein Inhalt überläuft, und einer Fußzeile, die durch eine eigene Schließen-Schaltfläche, einen externen Klick oder Escape geschlossen werden kann.

2426Shared-Element LightboxÜberlagerungenEin Raster aus Miniaturansichten, bei dem durch Klicken auf eine davon diese nahtlos in eine große zentrierte Überlagerung umgewandelt wird und durch Schließen wieder an ihre ursprüngliche Stelle zurückverwandelt wird.