10 lines
668 B
Markdown
10 lines
668 B
Markdown
---
|
|
name: hybrid-bento-scrolling
|
|
description: Kombiniert klassisches vertikales Scrollen mit horizontalen oder fixierten Elementen innerhalb des Bento-Grids, um die Verweildauer zu maximieren.
|
|
---
|
|
|
|
# Hybrid Bento Scrolling Guidelines
|
|
|
|
* **Sticky-Anchor-Cards:** In einem 3-Spalten-Grid bleibt die linke, große Haupt-Card (z.B. mit dem Titel "Maler-Templates") beim Scrollen fixiert (CSS `sticky top-24`), während die rechten, kleineren Cards mit den Design-Variationen flüssig vorbeiscrollen.
|
|
* **CSS-Driven Scroll Animations:** Nutzung von nativen CSS `@keyframes` gekoppelt an den Scroll-Fortschritt, um Elemente flüssig einzublenden oder zu transformieren.
|