# greensock/greensock-js

**Attribution required: if you use, quote, or summarise this content, you must credit and link back to [awesome-repositories.com](https://awesome-repositories.com/repository/greensock-greensock-js).**

25,916 stars · 2,042 forks · JavaScript

## Links

- GitHub: https://github.com/greensock/GreenSock-JS
- Homepage: https://gsap.com
- awesome-repositories: https://awesome-repositories.com/repository/greensock-greensock-js.md

## Description

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 screen sizes.

The library covers a broad range of animation capabilities, including high-precision value interpolation and the sequencing of complex visual movements. It manages element animation and interaction through a system that calculates fluid intermediate states to create natural movement.

## Tags

### Graphics & Multimedia

- [Web Interface Animation Libraries](https://awesome-repositories.com/f/graphics-multimedia/web-interface-animation-libraries.md) — Provides a comprehensive library for animating CSS properties, SVG attributes, and JavaScript values in web interfaces.
- [Value Interpolation Engines](https://awesome-repositories.com/f/graphics-multimedia/value-interpolation-engines.md) — Provides high-precision value interpolation and easing functions to create natural movement between animation states.
- [Responsive Animation Adapters](https://awesome-repositories.com/f/graphics-multimedia/media-production-suites/animation-tools/animation-patterns/responsive-animation-adapters.md) — Provides adapters to conditionally execute animation setup based on media queries for device consistency. ([source](https://github.com/greensock/greensock-js#readme))

### Part of an Awesome List

- [CSS Animations](https://awesome-repositories.com/f/awesome-lists/devtools/css-animations.md) — Enables high-precision animation of CSS properties and SVG attributes for smooth visual transitions. ([source](https://github.com/greensock/greensock-js#readme))
- [Animations and Motion](https://awesome-repositories.com/f/awesome-lists/devtools/animations-and-motion.md) — Delivers high-performance HTML5 animations.

### System Administration & Monitoring

- [Animation Timing Engines](https://awesome-repositories.com/f/system-administration-monitoring/performance-monitoring-tools/performance-resource-management/frame-rate-monitors/frame-timing-trackers/animation-timing-engines.md) — Implements a high-precision timing engine to maintain consistent animation playback regardless of frame rate fluctuations.

### User Interface & Experience

- [Refresh Rate Synchronization](https://awesome-repositories.com/f/user-interface-experience/animation-and-motion-systems/animation-lifecycle-hooks/animation-frame-monitors/refresh-rate-synchronization.md) — Synchronizes animation updates with the browser refresh rate via requestAnimationFrame to eliminate visual jitter.
- [Animation Interpolators](https://awesome-repositories.com/f/user-interface-experience/animation-and-motion-systems/configuration-utility-helpers/animation-configuration/animation-interpolators.md) — Uses animation interpolators and easing functions to calculate intermediate values for fluid motion. ([source](https://github.com/greensock/greensock-js#readme))
- [Dynamic Property Updaters](https://awesome-repositories.com/f/user-interface-experience/animation-and-motion-systems/configuration-utility-helpers/animation-configuration/animation-property-accessors/dynamic-property-updaters.md) — Uses dynamic property updaters to synchronize JavaScript object properties and CSS values with the animation frame.
- [Animation Timelines](https://awesome-repositories.com/f/user-interface-experience/animation-and-motion-systems/timeline-sequence-management/animation-timelines.md) — Orchestrates and synchronizes the sequential execution of complex multi-step animation events over time.
- [Timeline Orchestrators](https://awesome-repositories.com/f/user-interface-experience/animation-and-motion-systems/timeline-sequence-management/animation-timelines/timeline-orchestrators.md) — Provides timeline orchestrators to coordinate multiple animation objects into a single master controller.
- [Animation Frameworks](https://awesome-repositories.com/f/user-interface-experience/animation-frameworks.md) — Functions as a comprehensive framework for creating and managing complex UI animations and motion effects.
- [JavaScript Animation APIs](https://awesome-repositories.com/f/user-interface-experience/component-utilities/animation-engines/javascript-animation-apis.md) — Provides high-level JavaScript APIs for implementing precise animations on web elements and SVG graphics.
- [High-Performance Interpolation](https://awesome-repositories.com/f/user-interface-experience/high-performance-interpolation.md) — Implements high-performance interpolation to calculate fluid intermediate states for natural movement in web interfaces.
- [Scroll Progress Mapping](https://awesome-repositories.com/f/user-interface-experience/scroll-animations/scroll-progress-mapping.md) — Maps specific scroll ranges to normalized animation progress values to trigger movement based on user interaction.
- [Scroll-Driven Animation Tools](https://awesome-repositories.com/f/user-interface-experience/scroll-driven-animation-tools.md) — Ships an engine that synchronizes visual transitions and property changes directly with the user's scroll position.
- [Scroll-Driven Interaction Layers](https://awesome-repositories.com/f/user-interface-experience/scroll-driven-interaction-layers.md) — Links visual displacements and animation progress to scroll positions for interactive storytelling.
- [Responsive Animation Adjustments](https://awesome-repositories.com/f/user-interface-experience/responsive-web-interfaces/responsive-animation-adjustments.md) — Adjusts animation behaviors and timing based on media queries to ensure consistency across different device sizes.