All Plugins
Loaders - Loading animations
Free
Explore between 12 different loading options for your application.
About
Over 12 different loaders to customize your screen! Just drag-and-drop the element Loader into your Bubble Editor, select the animation and the color. That's it! Loader's spinners uses CSS Animation, which is wildly supported by all modern browsers such as Google Chrome and Mozilla Firefox. However, Microsoft Internet Explorer version earlier than 10 don't support CSS Animation. [quote][color=rgb(136, 136, 136)]This is a visual element *IT DOES NOT* actually loads anything. It gives the user a greater UI experience[/color][/quote]
Setup Instructions
[color=rgb(51, 51, 51)]This are step-by-step instructions on how to get the plugin working on any Bubble App.[/color]
[ml][ol][li indent=0 align=left][color=rgb(36, 36, 36)]Add this plugin to your application.[/color][/li][li indent=0 align=left][color=rgb(36, 36, 36)]In the Design Tab, in the Visual Elements category find 'Loader' and drag it into your Editor.[/color][/li][li indent=0 align=left][color=rgb(36, 36, 36)]Select a Loading Animation from the dropdown with the following options:[/color][/li][ol data=1][li indent=1 align=left]Bounce[/li][li indent=1 align=left]Chase[/li][li indent=1 align=left]Circle[/li][li indent=1 align=left]Circle Fade[/li][li indent=1 align=left]Flow[/li][li indent=1 align=left]Fold[/li][li indent=1 align=left]Grid[/li][li indent=1 align=left]Plane[/li][li indent=1 align=left]Pulse[/li][li indent=1 align=left]Swing[/li][li indent=1 align=left]Wander[/li][li indent=1 align=left]Wave[/li][/ol][li indent=0 align=left][color=rgb(36, 36, 36)]Select the Color of the loader.[/color][/li][/ol][/ml]
Full Documentation
[b]Loader[/b] is the only element given in this plugin. You need to add the element in your Bubble Editor. This Element contains the following properties to be used:
[ml][ul][li indent=0 align=left][b]Loading animation:[/b] select the desired loading animation from 12 different animations.[/li][ul data=1][li indent=1 align=left]Bounce[/li][li indent=1 align=left]Chase[/li][li indent=1 align=left]Circle[/li][li indent=1 align=left]Circle Fade[/li][li indent=1 align=left]Flow[/li][li indent=1 align=left]Fold[/li][li indent=1 align=left]Grid[/li][li indent=1 align=left]Plane[/li][li indent=1 align=left]Pulse[/li][li indent=1 align=left]Swing[/li][li indent=1 align=left]Wander[/li][li indent=1 align=left]Wave[/li][/ul][/ul][/ml] [ml][ul][li indent=0 align=left][b]Color:[/b] define the color of the loader.[/li][/ul][/ml]