Streaming live at 10am (PST)

[resolved] Fade-In Intro Page


#1

Hi Everyone,

I'm trying to make a simple intro page for my site. The idea is to have the link block to the rest of the website Fade In once the page is loaded (to suggest that the user should click it), then navigate to the use to the first page.

I'm playing around in the interactions sandbox, but can't seem to get the load trigger to work.

I've set the initial appearance of link block "vision link" to zero, then created a trigger on the background section to cause the link block to fade-in (turn to block view) upon loading, with a 500 ms transition.

Have any of you made anything similar?

Here is my shared site link:
https://preview.webflow.com/preview/sunstoneleadership3?preview=cd398145b01b7f3cf9f0660a407beab0

Thanks!


#2

Looks like you will want to put the Vision Link into the background (in your hierarchy). For the interaction create an initial state and change the opacity to zero - load state change opacity to 100% (careful, I find the opacity likes to stick at 99%). That will fade in everything all together.


#3

Interesting- I'll give that a shot.


#4

This worked great, thank you very much!

Here are my new settings:




#5

Glad it worked okay for you.

Jason


#6

Hi @FireOpal, glad you were able to make some progress with this. Thought I'd add this demo just in case anyone wants to take a peek smile

Demo: https://webflow.com/design/demokit?preview=72388b288a26874be319ca1f7412d4eb
Page Title: Splash Intro (Fade)


#7