Run animation only once ( when page loads )

Hi takkularapsis,

Thanks for using the Animate It!

I checked the website and I can see that you have already implemented it, and its working perfectly on Chrome, Firefox and Edge.

Good Job!

Hi,

Yes thank you, it is working but i dont want to run it than only once -> when page loads?

Hi,

Animation does happen as soon as the page loads.
However, you can add the following in your WordPress back end custom CSS:

.menu-item-104, .menu-item-102, .menu-item-205  {
	animation-delay: 2s;
}

This would give you a fixed delay of 2seconds, and that’s when the images would be loaded as well.

Let me know if this works for you.

Hi,

Sorry what i meant was that animation should play only one time when coming to web page. Now the problem is that, it loads the animation every time you click on the menu.

Oh. Sorry for not understanding you.
It cannot be done using the plugin.

However, using the following code, the animations would run only on the Homepage.
And that’s usually the very first page where people land anyway, so this can be one of the solutions.

Please do this:

First, Remove this from your custom CSS:

.menu-item-104, .menu-item-102, .menu-item-205 {
    animation-duration: 2s;
    animation-name: tada;
}

And Add this:

.home .menu-item-104, 
.home .menu-item-102, 
.home .menu-item-205 {
    animation-duration: 2s;
    animation-name: tada !important;
}

Let me know if this works for you.

No problem.

Aa, your solution was great. Did not think of that! Thank you!