Awesome GitHub RepositoriesDOM Animation Controllers

AOS is a scroll-triggered animation library that controls the execution, timing, and mapping of CSS transitions based on element visibility and browser viewport intersections. It functions as a DOM element animation controller and a viewport intersection trigger to initiate visual transitions as elements enter the screen. The library utilizes a custom CSS transition bridge to map scroll-based triggers to CSS class changes, enabling integration with external styling frameworks. It supports anchor-based animation triggers, allowing the visibility of one page element to act as the trigger point

WOW este o bibliotecă JavaScript și un controller de animație frontend care declanșează animații CSS atunci când elementele intră în viewport-ul browserului în timpul scroll-ului. Funcționează ca un motor de declanșare bazat pe viewport, gestionând sincronizarea și execuția tranzițiilor vizuale atât pentru conținutul static, cât și pentru cel dinamic. Biblioteca integrează evenimentele de scroll cu animații și efecte CSS din biblioteci precum Animate.css. Utilizează intersection observers pentru a monitoriza intrarea în viewport și mutation observers pentru a urmări și aplica declanșatoare de animație elementelor noi adăugate în DOM după configurarea inițială.

snabbt.js este un framework de mișcare JavaScript și o bibliotecă de animație CSS transform utilizată pentru a crea animații de înaltă performanță pentru elementele DOM. Acesta funcționează ca un motor de animație CSS 3D și un set de instrumente de geometrie bazat pe matrice pentru calcularea precisă a translațiilor, rotațiilor, scalărilor și înclinărilor. Framework-ul oferă un controller de animație condus de utilizator care permite ca progresul animației să fie legat de input-ul manual al utilizatorului, mai degrabă decât de redarea standard bazată pe timp. Permite simularea adâncimii și perspectivei prin animarea elementelor HTML în forme tridimensionale. Sistemul acoperă orchestrarea mișcării prin înlănțuirea animațiilor secvențiale și procesarea elementelor în loturi. Include capabilități pentru easing bazat pe fizică, animații de text la nivel de caracter și configurarea originilor de transformare pentru a manipula geometria elementelor.

move.js este un motor de mișcare JavaScript și un framework de animație CSS3 conceput pentru a anima elementele DOM. Funcționează ca o bibliotecă de animație DOM care modifică proprietățile elementelor vizuale și culorile în timp. Biblioteca servește ca un controller de easing bezier CSS, utilizând curbe cubic-bezier pentru a gestiona accelerarea și decelerarea animației. Permite designul de mișcare secvențială, permițând mai multor pași vizuali să se execute într-o ordine specifică. Framework-ul acoperă animația proprietăților elementelor, cum ar fi poziția, rotația, scalarea, înclinarea și culorile. Oferă capabilități pentru tranzițiile componentelor UI și aplicarea funcțiilor de easing pentru a crea o mișcare naturală.