Awesome GitHub RepositoriesJavaScript Animation APIs

This project is a declarative motion framework and JavaScript animation engine designed to transition CSS properties, SVG attributes, and DOM elements. It provides a comprehensive set of tools for creating complex, multi-part motion sequences by synchronizing animations, timers, and callbacks into a single, unified timeline. The library distinguishes itself through a robust timeline-based sequence orchestrator that allows for precise timing, label-based control, and hierarchical nesting of animations. It also features a physics-driven interaction library that enables draggable elements with c

Framer Motion is a React animation library and hardware-accelerated motion engine. It provides a suite of systems for managing declarative transitions, automated layout interpolation, and animation states within React user interfaces. The project distinguishes itself through a layout transition orchestrator that automatically interpolates visual changes when elements shift position or size. It includes an interactive gesture system to trigger motion based on drags, hovers, and taps, as well as tools for binding animation progress to scroll positions. The library covers a broad range of motio

GreenSock-JS is a JavaScript animation library and framework designed for animating CSS properties, SVG attributes, and JavaScript values. It functions as a scroll-driven animation engine and a sequencing system for coordinating multiple animations into a single timeline for precise execution across web browsers. The project provides tools for creating interactive scroll effects by linking animation progress to a user's scroll position. It also includes a responsive animation framework that adjusts behaviors and timing based on media queries to maintain consistency across different device scr

laxxx is a lightweight JavaScript framework for creating scroll-driven animations and DOM element bindings. It functions as a CSS interpolation engine and animation utility that maps numeric driver values to HTML attributes and styles in real time. The framework specializes in linking visual properties to scroll position and velocity, featuring built-in inertia to smooth out transitions and prevent abrupt visual jumps. It utilizes a driver-based system to generate numeric streams from inputs like mouse movement or time, which are then transformed into CSS outputs through easing equations and

tween.js is a JavaScript animation engine and numeric interpolation library. It is designed to calculate intermediate values between a start and end state over time, using easing functions to create smooth transitions for numeric values and object properties. The project functions as both an animation sequence manager and an easing library, allowing for the coordination of concurrent animation groups and the chaining of multiple transitions. It provides tools for managing the rate of change through acceleration and deceleration functions. The library covers a broad range of motion capabiliti

animateplus هي مكتبة رسوم متحركة خفيفة الوزن لـ JavaScript، مصممة لإنشاء انتقالات بصرية عالية الأداء بمعدل 60 إطاراً في الثانية واستيفاء عددي لعناصر المواقع. تعمل كمحرك رسوم متحركة يعتمد على الوعود (promises)، وتستخدم أنماط async await لترتيب جداول زمنية معقدة للحركة وتأخيرات التوقيت. تتضمن المكتبة محاكياً لضبابية الحركة (motion blur) يطبق ضبابية السرعة الاتجاهية على محوري X و Y لمحاكاة السرعة العالية. كما توفر أداة استيفاء عددي للانتقال بين الألوان والخصائص الرسومية بين الحالات. يدير النظام التحكم في العناصر بأداء عالٍ، مما يسمح ببدء وإيقاف وتأخير الرسوم المتحركة بدقة. كما يدعم تأثيرات الحركة الديناميكية من خلال استدعاءات (callbacks) لكل إطار يمكنها تشغيل منطق خارجي أثناء تقدم الرسوم المتحركة.

This project is a browser animation library and DOM animation engine that serves as a JavaScript polyfill for the Web Animations API. It provides a programmatic interface for driving visual property changes and transitions of document elements within web browsers. The library enables programmatic UI animation and dynamic document styling using keyframes and precise timing configurations. It supports a unified interface for both standard web elements and vector graphics animation.