Docs

[pdopchev]

Hi guys,

Is it possible to have an animation to a button like the “Support Policy” button on this page: https://www.themepunch.com/support-center/

Thanks!

[Rad]

Hi there,

Thanks for writing in.

Yes, it’s possible through rev. slider’s animation. The CSS responsible for that is this

a.tp-transparent-button-white i {
    font-size: 39px;
    color: #fff;
    left: 5px;
    -webkit-transition: left 0.2s ease-in-out;
    -moz-transition: left 0.2s ease-in-out;
    -o-transition: left 0.2s ease-in-out;
    -ms-transition: left 0.2s ease-in-out;
}
a.tp-transparent-button-white:hover i {
    left: 15px;
}

And the button code is this,

<a class="tp-btn tp-transparent-button-white onepager-link" href="#policy">Support Policy <i class="pe-7s-right-arrow"></i></a>

Though, you may need to replace the icon to this,

<a class="tp-btn tp-transparent-button-white onepager-link" href="#policy">Support Policy <i class="x-icon x-icon-right-arrow" data-x-icon="&#xf18e;"></i></a>

Thanks!

[pdopchev]

Thanks, will test it and let you know how it goes!

[Rupok]

Thanks for updating. Surely let us know how it goes.

[Author]

Posts