Skip to main content
MHO

Locomotive

A simple scroll library used by developers at Locomotive. Built as a layer on top ofayamflow’svirtual-scroll, it provides smooth scrolling with support for parallax effects, toggling classes, and triggering event listeners when elements are in the viewport.

01.
Speed control

Each element can be animated at a different speed. You get to choo-choo-choose!

Locomotive image from unsplash

Speed x2

4x

Locomotive image from unsplash

Speed x4

1x3x

Locomotive image from unsplash

Speed x6

2x6x9x

02.
Scroll direction

And if that wasn’t enough, make ‘em go backwards. Or upwards. Or downwards!

I’m moving in this direction
And in this direction
Sooo customizable. Right?
I can also go in this direction
Ok, enough!!!!

03.
Lerp elements

Stagger those smooth animations using delays to create a rushing or dragging effect.

01I have a lerp
02Me too!
And even more
03ByLetter
04Soooo smooooth

04.
Fixed elements

Create slides that stick and untick to the viewport while scrolling through.

If youEnjoyedScrolling

Github

Check out Locomotive Scroll

This library has evolved considerably over the years. The architecture and conventions shift according to our projects.

Visit the GitHub repository page for a complete introduction and list of available options. Search the GitHub issue tracker carefully to check if your issue/feature has already been reported/requested before opening a new issue or submitting a pull request.

Check on Github→

Neue Montreal
Pangram Pangram® Foundry

You like the font used on this page? Well this is your lucky day. You can get it onpangrampangram.com! Thanks to our good friend Mathieu Desjardins ❤️

🚂
🚂

DamnYou reallylike toscroll

MHO