Streaming live at 10am (PST)

Page Transitions


#1

I would like to be able to use transitions for each page. These are likely to be slide l/r, fade, slide up/down.

Is there a mechanism by which a page could appear to move diagonally? ie up one level and to the right or left

thanks in anticipation

Richard C


#2

Not at the moment. But we have plans to add another trigger for interactions that will trigger "After the page loads" (currently we have before page loads).

UPDATE: We added this feature for Page Load triggers (checkbox - wait for assets to load). Try to play with it.


#3

Hi @thesergie,
I'm trying to understand what do you mean by this line "currently we have before the page loads"?

I understand how "Wait for assets to load" option can be used in page transitions, but I would like to grasp the concept of "before the page loads" trigger. I think these two triggers would be enough to create page transitions... Could you elaborate on "before page loads trigger"? I don't seem to see it..


#4

Sure thing. "Before the page loads" is before the HTML begins to load. So it's setting the state of the html before it loads (by putting it in the <head> tag). "Wait for assets to load" is when everything on the site has been downloaded from the interwebs. Webflowies have been creating preloaders by showing an animation that is visible "before the page loads" but disappears once "all assets are loaded".


How to create a loading page before page loads assets
#5

Yeah that's what I'm trying to understand. How would you select the option of "before the page loads" - I get that to trigger an interaction once "all assets are loaded" is done by selecting the "Load" trigger. But how can you trigger an interaction/animation before that?


#6

Oh nevermind i figured it out.
The "Load" interaction fires from the < head > tag at the very beginning the page starts loading.
While checking the box "wait for assets to load" takes action after the that...

In my mind "Load" trigger meant "On page load"...

Also this tutorial came up: http://forum.webflow.com/t/tutorial-how-to-implement-a-page-loader/2243/18


#7