1 Repo
Awesome GitHub RepositoriesDynamic Layout Morphing
Fluidly transitioning a page layout by sliding and resizing elements between different configurations.
Distinguishing note: Existing candidates cover grid observers or frame refreshes, but not the organic morphing of a layout's spatial state.
Explore 1 awesome GitHub repository matching user interface & experience · Dynamic Layout Morphing. Refine with filters or upvote what's useful.
Awesome Dynamic Layout Morphing GitHub Repositories
Finde die besten Repos mit KI.Wir suchen mit KI nach den am besten passenden Repositories.
- rich-harris/ramjet
Rich-Harris/ramjet
5,438Auf GitHub ansehenRamjet ist eine JavaScript-Animations-Engine und eine Bibliothek für DOM-Element-Morphing. Sie fungiert als Übergangs-Utility, das Bewegungen und Dimensionen zwischen verschiedenen HTML-Elementen animiert, um visuelle Verschiebungen zwischen Interface-Zuständen zu erzeugen. Die Bibliothek ist auf Cross-Tree-Element-Morphing spezialisiert, was es ihr ermöglicht, die Position und Dimensionen eines Elements so zu animieren, dass sie mit einem anderen übereinstimmen, unabhängig von deren relativer Position in der Dokumentenhierarchie. Dies erreicht sie durch die Berechnung visueller Offsets und die Nutzung eines anpassbaren Klon-Mechanismus zur Erstellung temporärer visueller Proxies. Das System verwaltet organische Bewegungen durch benutzerdefinierte Timing-Funktionen und Easing-Kurven. Es koordiniert diese Transformationen mittels hardwarebeschleunigter Translationen und Opacity-basierter Sichtbarkeitssteuerung, um Elemente zu überblenden, ohne Browser-Layout-Reflows auszulösen.
Smoothly slides and resizes elements to morph the page layout from one configuration to another.
JavaScriptanimationcssdom
