Open tab does not display arrow

Everything works fine but not when it’s first loaded.

https://preview.webflow.com/preview/amaxx?preview=901a4474545a342e2ccf77cd1e42c031

newsletter page.

please advise.

Hello @JaimeGizzle!

Probably you change something already, because it is appear on 1st load on 1st tab-link now, but then it never go back.

I would recommend to do this:

  1. do not apply any interaction and initial appear to triangles,
    2)add 2 more steps in the “Tab bounce” interaction:
  • trigger -TAB, affect different element (will got all triangles), move up 12 px, opacity=0%

-trigger-TAB, affect different element (got nested triangle), move to origin, opacity=100%

Should work :smiley:

Regards,
Anna

I tried your steps and could not understand.

  1. so you are saying delete this: Screenshot by Lightshot
  2. I cannot add add 2 more steps like you did. Looks like 2 interactions.

Is there a tab tutorial for this new versions. I was following the old version

Thanks for your help.

Hello again, Jaime.

Unfortunately, there is no official tutorial for current situation. I made more detailed screenshots, hope it will show process more clear.

1)First take care of triangles:


  1. Then tab-links:


—>


—>


trigger -TAB, affect different element (will got all triangles), move up 12 px, opacity=0%, transition time should be 0 MS (zero)
—>>

next trigger-TAB, affect different element (triangle, but NESTED), move to origin, opacity=100%, transition time - as you wish


You will end up with interaction with 3 triggers:

Hope it is more clear now :blush:

Good luck,
Anna

This topic was automatically closed 60 days after the last reply. New replies are no longer allowed.