Streaming live at 10am (PST)

Delay Mouseover Transition till after Page Load Transition


#1

Hi all,

I have a page load transition that runs on the hero but also a mouseover transition whihc effects the same elements.

How do I stop the mouseover transitions until after the page load transition is complete?

Thanks for the help,

TJTJ


Here is my site Read-Only:

https://preview.webflow.com/preview/marieclarienergymedicine?utm_source=marieclarienergymedicine&preview=bbb5ee18ccdfba7d5e4ab4ce2602e27e


#2

Hi TJTJ,

It appears that your share link needs updating as it won’t load the correct page.

Cheers
Keiran


#3

My apologies, here it is:

https://preview.webflow.com/preview/marieclaireenergymedicine?utm_source=marieclaireenergymedicine&preview=d4e1e15d1d2f068d3150a1379e7a0a34

The issue is it is causing the initial page load animation to ‘jerk’ at certain points - this occurs frequently as there are multiple uses of both transition types. Is there anyway to delay the ‘mouseover’?

Thanks,

TJ


#4

For anyone looking for a solution for this, I’ve used a transparent ‘blocker’ div that disappears once the transition is complete. This means the initial transition remains uninterrupted until teh blocker disappears and the mouseover interaction targets the cursor.

Super easy fix!

Whoop