Viewing 3 posts - 1 through 3 (of 3 total)
  • Author
    Posts
  • February 13, 2019 at 10:20 pm #1066660
    jomo5280

    I have a Tab section with 3 tabs – and have 3 columns in each tab with multiple 1/3 columns with a fade animation on all the column element containers.
    The first tab works great, all content fades in sequentially. However when switching from tabs – it seems the fade in stops working after the second row. It seems to get stuck on transparent for some reason. If i shift refresh the page – it seems to force them to load and fade in correctly.

    it seems this css does not get triggered at times:

    .avia_transform.avia_desktop .av-animated-generic {
    opacity: 0;
}

    Any thoughts on what is going on or how i can fix?
    thanks!

    • This topic was modified 5 years, 9 months ago by jomo5280.
    February 14, 2019 at 1:34 am #1066709
    jomo5280

    Fixed! I added the following classes to my column elements to force all fade-in columns to animate on page load or tab title click (not waiting to scroll through viewport).

    CSS Class:
    av-animated-generic fade-in avia_start_animation avia_start_animation_when_active

    I think the “avia_start_animation_when_active” class forced it to start animation on page load/tab title click.
    This fixed content in my tab-sections that had the fade effect not to get stuck on 0 opacity.

    Hope this fix helps others if they have same situation!

    • This reply was modified 5 years, 9 months ago by jomo5280.
    February 14, 2019 at 10:01 pm #1067164
    Victoria

    Hi jomo5280,

    Glad you got it working for you and thank you for sharing! :)

    If you need further assistance please let us know.

    Best regards,
    Victoria

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