How To Delay Or Animate Buttons Or Modules
In this article, you are going to learn the 2 ways of adding animation and delay to a button or any Lime Funnels modules in your Funnel, Web Page, Course, and Blog.
Lime Funnels Advanced Animation
You can animate almost any content on your Site using the Lime Funnels Advanced Animation that can be found on Module's Settings > Advanced > Animation in all of your Lime Funnels modules.
![](https://tawk.link/6584a38c70c9f2407f825999/kb/attachments/u1CNwRRQlj.png)
![](https://tawk.link/6584a38c70c9f2407f825999/kb/attachments/c7aFIJd45r.png)
Animations
Lime Funnels Advance Animation lets your Content gradually change from one style to another. Below are the available animations in any of your Lime Funnels Module:
![](https://tawk.link/6584a38c70c9f2407f825999/kb/attachments/3AvASKRdzU.png)
![](https://tawk.link/6584a38c70c9f2407f825999/kb/attachments/WxJYKiNlyM.png)
Delay
This specifies a delay for the start of an animation.
Duration
The duration defines how long an animation should take to complete. If the animation duration is not specified or set to "0", no animation will occur.
Fade In Animation using CSS and JavaScript
Simply copy and paste into Lime Funnels.
1. Open the module you want revealed go to advanced and set the ID to reveal-30
2. Go to layout CSS for the page and add this CSS
#reveal-30 {
display:none;
}
3. Go to layout JS and add this:
// assume the hidden div has ID #revead-30
(function($){
$(document).ready(function(){
{
setTimeout(function(){
$('#reveal-30').fadeIn();
}, 30000); // 30000 is 30s
});
})(jQuery);