ScrollMagic is a jQuery plugin which essentially lets you use the scrollbar like a progress bar.
It's the plugin for you, if you want to ...
- ... start an animation at a specific scroll position.
- ... synchronize an animation to the scrollbar movement.
- ... pin an element at a specific scroll position (sticky elements).
- ... pin an element for a limited amount of scroll progress (sticky elements).
- ... easily add a parallax effect to your website.
- ... create an inifinitely scrolling page (ajax load of additional content).
- ... call functions when the user hits certain scroll positions or react in any other way to the current scroll position.
Browse the examples or read the documentation to get started.
For the installation manual and source code visit the project on github or download the latest version as zip or tar.
History
ScrollMagic is a complete rewrite of its predecessor Superscrollorama by John Polacek.
Like Superscrollorama it relies on the Greensock Animation Platform (GSAP) to build animations, but was developed with specific regard to former shortcomings.
The major perks of using ScrollMagic include:
- optimized performance
- flexibility
- mobile compatibility
- ready for responsive webdesign
- object oriented programming and object chaining
- event management
- support for both scroll directions (even different on one page)
- support for scrolling inside div containers (even multiple on one page)
- extensive debugging and logging capabilities
Credits
ScrollMagic c Jan Paepke follow @janpaepke
Greensock Animation Plattform (GSAP) by Greensock