ScrollMate

ScrollMate

Scroll Triggered Animations

Powerful scroll animations; Low impact on browser performance.

ScrollMate only animates properties that are light on processing power so your pages stay smooth even with lots of animations.

Donate

Your kind donations fund the running costs and keep the stacks and support free.

Thank you in advance.

ScrollMate

ScrollMate adds smooth scroll activated animation effects to web pages.

As you scroll down the page ScrollMate can scale, rotate, translate and change the opacity and perspective of elements on your page.

Why just these properties? Because browsers can animate them quickly, keeping scrolling silky smooth.

ScrollMate is carefully implemented to have minimal effect on browser performance, even when there are lot of animated elements on the page

PLEASE NOTE: Since the advent of iOS 9, scroll triggered animations will not occur on touch devices. Your ScrollMate stacks will gracefully handle this and just appear in their normal non-animated state.

Highlights

Easy To Use, Dynamic Results...


Drop a ScrollMate stack on your page, drop in other stacks that you want to animate.

Set up when the animation should start, on entry or as the stack exits the page triggered by either the top or bottom edge of the stack, or when the whole stack is in view.

Fine tune the start and end of the animation as a percentage of the page height.

Choose the easing effect

See the Doc File For Full Instructions

Theme Compatibility
ScrollMate will work with any RapidWeaver theme. It is not Foundation specific. Non free-form themes however may restrict the animation effects to their content width. Please see the demo site for examples.

Browser Compatibility
Scroll triggered animations may not be supported in older browsers. You page will still display normally and all content will be shown statically without the scroll activated animations.

Related Articles