Animate On Scroll

Details

This element allows you to trigger animations within your page once the the user scrolls to them and they get into the view of the user. You can choose between 27 different animations, specify the duration/delay of the animation and choose if the animation should be repeated or only showed once. This plugin allows you to create much more dynamic web applications with a better user experience. You also do not have to take care of the users current scrolling position in reference to which element will be animated. This plugin will do all of that for you!
Works best with groups and images.

For a demo please visit: https://3dimage.bubbleapps.io/aos

Icons made by https://www.flaticon.com/authors/freepik Freepik from https://www.flaticon.com Flaticon

Categories

Containers Media Productivity Technical Mobile, Visual Elements

Types

Element

Links

Service Link:

https://www.rapidevelopers.com

Instructions

1. Head over to Settings->General of your application and expose the option to add id attributes to html elements
2. Drag the element "Animate on Scroll" onto your page.
3. Add unique element IDs to the elements that should be targeted by this animation. Enter the same ids into the Plugin element ids fields (you can add up to 5 different ids). This plugin works best with groups, so the easiest way is to just wrap the elements that should be targeted into a group.
4. Choose the style of the animation, the duration and the delay.
5. Choose whether or not the animation should run everytime the user scrolls past it or if the animation should only run for the first time.

*Elements have to be visible on page load in order for the plugin to work.