10

 A combination of in & out animations on multiple elements. Start animation at 20% and end animations at 80% viewport height.

In & out animations
Or reveal elements in a nice way

This demo is created with Maglr Pro for the purpose of showing the new scroll interactions. With Maglr you can create beautiful interactive content without technical knowhow, developed for the professional designer. Give it a try and start a trial.

Try it yourself
6

Scroll animation start at 30% vertical viewport height

Rotate
9

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin lacus augue, dapibus a aliquet et, molestie quis nunc. 

Manual animation
8

Scroll animation start at 30% vertical viewport height with extra keyframe animated bike.

Keyframe animation
7
Flip
4

Scroll animation start at 30% vertical viewport height

Move right
5

Scroll animation start at 30% vertical viewport height

Zoom
3

Scroll animation start at 30% vertical viewport height

Fade step
2

Scroll animation start at 30% vertical viewport height

Mask in
1

Scroll animation start at 30% vertical viewport height

Fade in
MAGLR PRO EDITOR

In this demo page we show you a few examples how the new scroll trigger animations can be used to built up you interactive longreads in a beautiful way.

Scroll trigger animations

This demo is not available for mobile yet. Please switch to a bigger screen to see these new animations in use. 

Scroll trigger animations