Multiple Interaction Issues

I have no idea if this is a bug or I’m just doing stuff wrong.

First when the page loads my hover interactions are active, I have set the initial state then the transition/animation. However it appears that when I load my interaction has already occoured for hover.

So lets say button initial scale:1 then scale:1.2 when I load the page the button is 1.2 in scale? I have no on page load interactions

Second is transitions between pages.

I have an interaction where a div bloc fades in a color then transitions to the next page and the div on that page fades out, however the first page fade out works but the next page fade in doesn’t. I have set the interaction to be “when page is loaded”. Clicking Solutions is supposed to activate

Here is the preview
[Webflow - A Anthony Corp]


Here is my public share link: LINK
(how to access public share link)

@bennraistrick can we see a live link not editor?

Hi here is the link

http://aanthonycorp.webflow.io/

Hi,
The transition seems to work for me on your published site but it does move a good bit quicker than preview in designer shows.

“side-color-alt” is showing an initial state of 100vh on the page load transition. Once I set it to 0vh I get the tranny. I also added some additional time to the interaction. I increased the duration to 1sec and this seems to give a better result. Of course, I’m unable to publish it to see how things work.

I’ve had multiple issues with page load interactions using new interface. Usually on integrated exported sites. The jquery loads at the end of the body element. Not sure if this could cause issues in your case. I’ve reverted back to legacy page load interactions for this reason. They always seem to work for me but it requires giving a page load interaction to each of the individual elements vs. being able to control multiple elements in the single timeline like ix2 does.

Your transform hovers work as expected on my end.

Thanks for looking into this and the advice timing, one thing you would notice is say you navigate from solutions when the page loads it should fade also but the page load doesn’t fire, like you said this could be the stack of the JS.

The buttons when you load are more noticeable when you first hover its like the interaction doesn’t happen, but when you rollover again they work. Note: could the JS I have for the page transition be causing this to happen.

You’re right! I kind of didn’t notice the hover issue until really paying attention.

Well a quick fix for that would be to remove the interaction altogether and simply use the basic hoverstate panel since these hovers a relatively simple. You can achieve the exact same look and it will probably load correctly.