With our plugin you can: Animate any element (PNG, SVG, etc.) Create morphing effects Create “writing by hand effect” Create rotations of arched text or any other element Create transition between elements Create button hover effects Create sliding effects
And many many more ! Be creative!
*The plugin has one element “Anime JS” which has an action “Anime”.
HOW IT WORKS
Position the plugin element anywhere on the page.
Call the “Anime” action in Workflow and pass the required values.
I recommend to look at our demo page and study the action parameters for various animations (Transition, Scale, Morph, Text)
Notice that each parameter in action has several variables: el - The curent animated targeted element i - The index of the animated targeted element l - The total number of animated targets
You can use these parameters as you like, the main thing is that each action parameter contains the keyword - anime
AVILABLE PARAMETERS:
Translate (px) - moves the element by the given values Rotate (deg) - rotates the element by the given values Scale - changes the size of an element Skew (deg) - transforms an element by skewing it in 2D space Perspective (px) - defines the distance between the z-plane borderRadius - border rounding duration - Defines the duration in milliseconds of the animation. delay - Defines the delay in milliseconds of the animation. endDelay - Adds some extra time in milliseconds at the end of the animation. Easing - Defines the timing function of the animation. direction - Defines the direction of the animation.
- ‘normal’ - Animation progress goes from 0 to 100%;
- ‘reverse’ - Animation progress goes from 100% to 0%;
- ‘alternate’ - Animation progress goes from 0% to 100% then goes back to 0%;
Loop - Defines the number of iterations of your animation.
- Number - The number of iterations;
- True - Loop indefinitely; keyframes - Animation keyframes are defined using an Array, within the keyframes property. points - SVG Points Array
Please, feel free to ask any questions, use our support links , and leave your reviews so we improve our products!
Insight Custom scrolling FREE plugin | Reusable element scroll IS COMING SOON
Working on it! What animations examples you would like to create in your website? We are about filming practical tutorials about how to build specific animated blocks / elements / etc.
So if you have an example or specific task, we’ll be glad to review and help you with that!
Hi all! First of all, we want to say that we are glad to see new users of our plugin, thanks to you we are making the product better and regularly supporting it.
Today we have finally released the long-awaited short tutorial on the first animation template from our page.
This example is special and you can create it on your website in 3 minutes! No code!
We’ve released another Animations tutorial today! How to create Rotating Text Effect in bubble.io with no-code?
The plugin in video is paid, but for the fair price you’ll be able to build thousands of animations without single line of code and use templates created by team of professionals! Pay once and save hours of work time!
Hopefully it helps a few people who searched this popular effect!
Hi, excellent plugin btw! 1 question though… I am using the card slider animation and followed your guide however i am having trouble with the Card group showing the correct Card based from the repeating group. Note that i am using a specific data source since i want the Card to show images i have uploaded instead.
The RG is displaying the data source but the Card is just stuck at showing item 1. How do i fix this? TIA!
EDIT: Nevermind, finally figured it out! The cell index is actually needed for the whole plugin to trigger its effect. Since i was just looking to display the image, there was no text element stating it Cell index. I decided to add it to check if the counter will work atleast and voila! The whole thing is working like magic!!!
Thank you again for this blessing of a plugin!
EDIT 2: Is there any way to spread out the blurred cards in the background? Like give them atleast 100 px of distance in between?
Also, is it possible to have have wrap around option? So if i reach the end of the card, clicking Next or Previous will loop back to the top or last respectively? TIA
DOWNLOAD PLUGIN HERE
Animate any element (PNG, SVG, etc.)
HOW IT WORKS
You can use these parameters as you like, the main thing is that each action parameter contains the keyword - anime
AVILABLE PARAMETERS:
Translate (px) - moves the element by the given values
Insight Custom scrolling FREE plugin | Reusable element scroll IS COMING SOON
First of all, we want to say that we are glad to see new users of our plugin, thanks to you we are making the product better and regularly supporting it.
