For full API see Gsap ScrollTrigger API.


A sticky can be achieved by assigning ScrollTrigger with pin: true and pinSpacing: false.

SyntaxDefault / ArgumentsDescription
Optionpin:Boolean|String|ElementfalsePin the trigger when scrolling
OptionpinSpacing:Boolean|StringtrueAdd distance spacing for the pinned element

Use the component classes to create a sticky.

Component.xt-stickyxt-stickyStyles for sticky
Component.xt-sticky.xt-sticky-nozindexxt-sticky xt-sticky-nozindexDo not set z-index for this sticky
Component.xt-sticky.xt-sticky-noheightxt-sticky xt-sticky-noheightDo not set height and maxHeight for this sticky

You can toggle classes on activation using toggleClass: '<className>'.

SyntaxDefault / ArgumentsDescription
OptiontoggleClass:String|ObjectnullToggle class with ScrollTrigger activation/deactivation

You can also use once: true to destroy ScrollTrigger as soon as the end position is reached once.

SyntaxDefault / ArgumentsDescription
Optiononce:BooleanfalseActivate only once


Use trigger, start, endTrigger, end to control activation depending on position of trigger relative to viewport.

Use endTrigger: 'html' and end: 'bottom top' to make the end position infinite.

SyntaxDefault / ArgumentsDescription
Optiontrigger:String|ElementundefinedScroll trigger
Optionstart:String|Number|Function'top bottom'Start position: first argument is for trigger second argument is for scroller
OptionendTrigger:String|ElementfalseEnd trigger
Optionend:String|Number|Function'bottom top'End position: first argument is for endTrigger second argument is for scroller

Here's an example of complex sticky stacking.


You can use onEnter, onLeave, onEnterBack, onLeaveBack, onToggle, onUpdate, onScrubComplete, and onRefresh to animate on certain events.

Do not transition or transform on .xt-sticky when pin: true because of transform positioning, transition the content instead.

Here's an examples of sticky that hides depending on scroll position.

Here's an examples of sticky that hides depending on scroll position and scroll direction.