Demo
Scroll to a numeric scroll offset, a DOM element, the start of a scene or provide an alternate method for: update: Updates the controller params and calls updateScene on every scene, that is attached to the controller. UpdateScene: Update one ore more scene(s) according to the scroll position of the container. Section Wipes (natural) Wiping in content with the natural scroll movement. This commonly used effect can be very easily achieved using ScrollMagic's Scene.setPin method. If you want to create a 'pause' between the slides, simply add a margin-bottom to them (see between slide 3 and 4). The javascript library for magical scroll interactions. Tags: Scroll, Ecosystem:jquery, Jquery-plugin, Progress, Events, Animation, Parallax, Scrolling, Sync, Fixed.
- Overview
- Documents
ScrollMagic is a jQuery plugin which essentially lets you use the scrollbar like a playback scrub control.
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.
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
1. INCLUDE JAVASCRIPT
And to have access to the debugging extension during development, include this file additionally:
2. HTML
Magic Scroll Jsa
3. JAVASCRIPT
4. EXAMPLES
Check out the examples for full reference.
Demo- Overview
- Documents
User Rating: 3.5/5( 4 votes) ScrollMagic is a jQuery plugin which essentially lets you use the scrollbar like a playback scrub control.
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.
Magic Scroll Js Example
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
Magic Scroll Js Online
1. INCLUDE JAVASCRIPT
And to have access to the debugging extension during development, include this file additionally:
2. HTML
3. JAVASCRIPT
4. EXAMPLES
Check out the examples for full reference.