Loading Overlay Animations

Details

This plugin allows you to add a wide variety of different overlay loading animations to groups within your bubble application. You can for example display an overlay of your signup form, certain areas of a page etc.
You can define the duration of the animation, the effect, the color, the size, the text and you can upload an image to be used. Once an animation is complete, is triggered which you can use to trigger subsequent workflows.

For a demo of this plugin please visit: https://rapidevplugins3.bubbleapps.io/version-test/loading

For a demo of this plugin in the bubble editor please visit: https://bubble.io/page?type=page&name=loading&id=rapidevplugins3&tab=tabs-1

Icons made by https://www.flaticon.com/free-icon/loading_2250204?related_item_id=2250090&term=loading from https://www.flaticon.com

Categories

Containers Media Productivity Technical Visual Elements

Types

Element Event Action

Links

Service Link:

https://www.rapidevelopers.com

Instructions

1. Go to settings->General and check the box that says enable the option to add id attributes to html elements
2. Choose the element where you want the animation to be applied. This plugin works best with groups. Create an unique element id.
3. Drag the Loading Animation element onto your page.
4. In your workflows, use the "Trigger Loading Animation" to trigger an animation. You can specify all animations within the settings. Use the element id you created in step 2.
5. Once an animation has been completed, an event is triggered. You have access to this event by going to your workflow tab and choosing the event from the elements submenu.