Viewing 10 posts - 1 through 10 (of 10 total)
  • Author
    Posts
  • August 9, 2020 at 8:10 am #1236281
    anristudio

    I found couple of forum posts with CSS which did not work in my case to slow down animation of an icon.
    I’m trying to slow down animation of icons on home page (DATA CENTER MODERNIZATION, AZURE MANAGED SERVICES)
    Details in private

    August 9, 2020 at 6:47 pm #1236315
    Victoria

    Hey anristudio,

    You can play with the seconds’ value in this css to get the value that works for you:

    
.avia_transform .avia_start_delayed_animation.av_font_icon.avia-icon-animate {
    -webkit-animation: avia_appear 0.7s 1 cubic-bezier(0.175,0.885,0.320,1.275);
    animation: avia_appear 0.7s 1 cubic-bezier(0.175,0.885,0.320,1.275);
}

    If you need further assistance please let us know.
    Best regards,
    Victoria

    August 10, 2020 at 12:02 am #1236354
    anristudio

    Thank You @Victoria – your solution worked.
    I adjusted seconds to “3s” which slowed down animation.

    Quick question about icons.
    Please see URL in private.
    Could ENFOLD do something similar when you hoover over with mouse?

    August 10, 2020 at 12:45 pm #1236420
    Rikard

    Hi,

    Thanks for the update. Please try this CSS as well:

    .home #av_section_1 .av_one_third:hover {
    box-shadow: 3px 3px 3px #eee;
}

    Best regards,
    Rikard

    August 11, 2020 at 7:18 am #1236591
    anristudio

    Hi @Rikard
    Thank you so much!
    This worked perfectly!

    August 11, 2020 at 7:33 am #1236597
    anristudio

    @victoria / @rikard

    Is it possible to make Enfold ICONS
    behave similar mouseover animated color effect just like this page (see private)

    August 11, 2020 at 8:19 pm #1236734
    anristudio

    Also @rikard, how would i make same ICON effect on other pages?

    August 14, 2020 at 10:37 am #1237731
    Victoria

    Hi anristudio,

    The example website is unavailable. Do you have another link?

    Best regards,
    Victoria

    August 19, 2020 at 10:28 pm #1239316
    anristudio

    Victoria,

    Sorry about that. Details in private?
    Is is possible to have icons on HOME page also change color on mouseover?

    August 26, 2020 at 2:28 pm #1240921
    Ismael

    Hi,

    Thank you for the update.

    You can use this css code to apply a shadow to the icons on hover.

    .av_font_icon:hover .av-icon-char::before {
	text-shadow: 3px 3px 3px #eee;
}

    If you have any additional questions at this time we kindly ask that you open them up in a separate thread. The longer threads get in the forum, they become more difficult to support as they tend to drift off topic and they also make it troublesome for users trying to search for solutions. Keeping threads relevant to their original inquiry ensures that we can keep better track of what has been resolved and that users can more effectively find answers to similar issues they might be experiencing.

    Thanks!

    Best regards,
    Ismael

  • Author
    Posts
Viewing 10 posts - 1 through 10 (of 10 total)
  • You must be logged in to reply to this topic.