Text animation intro

Design help General
1

Hi all,

Any ideas on best way to approach the following animation in Webflow?

hello

So it starts off with Hello… then Hey… they Hi.

:slight_smile:

Thanks,
Ryan

2

@ryan585 if I were do it in webflow I would create a wrapper div then create 3 divs hello hey and hi, stack them on top of each other and loop fade through all 3 words

1 Like
3

Hi. Thanks for your response.

I’m fairly beginner in webflow so could you break down the following please.

  1. Create a wrapper div (best way to do this?)
  2. Stack them on top of each other (perhaps absolute positioning?)
  3. Loop fade through all 3 words (best way to do this? I forgot to add I want it to stop on the last word)

Thanks!

4

When I say wrapper div in thing you put inside is wrapped in it.

so if i create a div to keep content together, example select div drag it over to the canvas and give it a style called for example animation.

then i would drag 3 text blocks i would give them styles to suit. hello hey hi,
now before i position in that div animation I want to add my action which in this case is opacity once.

Once I have completed my action script for each one I would stack them on top of each other using absolute.

1 Like
5

@ryan585 this should point you in the right direction
https://webflow.com/website/Hello-Hey-Hi

1 Like
6

dude this is great, i think i can work it out from here

will let you know how i get on :slight_smile:

massive thanks once again

1 Like