Welcome, Guest

TOPIC: Animation FA icon on Parent hover

Animation FA icon on Parent hover 5 years 8 months ago #1306

evbo
Offline
New Member
Posts: 1
Karma: -1

Hi Animate it!

I've got a contact button <a class=button> with an FA icon inline. I wnat the icon to animate, when hovering over the parent button or <a>.
I've applied a css class (from class generator) on the icon already, but with no succes so far..

This is also original code:

<p><a class="button groen" href="#footer-cta">Direct aanvragen&nbsp;<i class="fas fa-chevron-circle-right animated fadeOutRight delay1 duration2 infinite  eds-on-hover "></i></a></p>

And this is displayed code on front-end:

<a class="button groen _mPS2id-h" href="#footer-cta">Contact now <svg class="svg-inline--fa fa-chevron-circle-right fa-w-16 eds-on-hover" aria-hidden="true" data-prefix="fas" data-icon="chevron-circle-right" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" data-fa-i2svg=""><path fill="currentColor" d="M256"></path></svg><!-- <i class="fas fa-chevron-circle-right  eds-on-hover"></i> --></a>

It seems the class gets stripped from it?

Many thanks!

Attachments:

...ton.PNG (3KB)

The administrator has disabled public write access.

Animation FA icon on Parent hover 5 years 8 months ago #1307

eLEOPARD
Offline
Administrator
Posts: 409
Thank you received: 54
Karma: -28

Dear Evbo,

Thanks for using the Animate It!

Regarding your issue.
It looks like a conflict from another plugin/theme script.

Ideally, How Animate It! will work in your case would be:
1. eds-on-hover would be added initially to the frontend.
2. Your selected animation classes would be added when the icon is hovered.

Please send me the link to the page where this issue is, and I'll look into the issue in detail.

The administrator has disabled public write access.