Locomotive Scroll
🛤 Detection of elements in viewport & smooth scrolling with parallax.
Install / Use
npx skills add locomotivemtl/locomotive-scrollInstalls into whichever agent you are using.
README
Locomotive Scroll
A lightweight & modern scroll library for detection, animation, and smooth scrolling. Built on top of Lenis.
Documentation
Full documentation available at scroll.locomotive.ca/docs.
Quick Start
npm install locomotive-scroll
import LocomotiveScroll from 'locomotive-scroll';
const scroll = new LocomotiveScroll();
@import 'locomotive-scroll/dist/locomotive-scroll.css';
<div data-scroll data-scroll-speed="0.5">I move at half speed</div>
Features
- Lightweight — Only 9.4kB gzipped
- TypeScript First — Fully typed
- Built on Lenis — Latest stable release with improved performance
- Dual Intersection Observers — Optimized detection for triggers vs. animations
- Smart Touch Detection — Parallax auto-disabled on mobile
- Accessible — Native scrollbar, keyboard navigation, proper ARIA support
Demo
Check out the examples and playground
Support
Related Skills
node-connect
385.5kDiagnose OpenClaw Android, iOS, or macOS node pairing, QR/setup code, route, auth, and connection failures.
blender-python-addon
40.5kBlender Python add-on rules for operators, panels, properties, registration, testing, and API-safe scripting
flutter-development-guidelines-cursorrules-prompt-file
40.5kCursor rules for Flutter development with MVVM architecture, Riverpod state management, Material widgets, and Dart style guidelines.
commit-push-pr
140.6kCommit, push, and open a PR
