Streaming live at 10am (PST)

Interactions only playing through Interactions Pane


#1

Hi Webflow Friends,

I’ve got a preloader interaction that is supposed to animate some content in once loading is complete. Unfortunately the animation only plays when when previewing the animation through the interactions pane. I’m not sure why? Any help would receive super-love.

Nic


Here is my public share link: https://preview.webflow.com/preview/get-set-a5e6b618ed27b9274-9c419e1eba53b?preview=5b0fde28bc3cc45859db158c871f09cf
(how to access public share link)


#2

Hi @Nic1, thanks for the report. I took a look and it seems like the pre-loader animation is running for me in the site preview mode.

Is it possible for you to take a screencast of what you are seeing ? Here is a good tool: https://getcloudapp.com.

Thanks in advance.


#3

Hey Dave, it runs in preview mode, but some of the timed animations are only running when pushing play from the interactions panel. I’ve hidden a section to make things a bit clearer. Please see this video (https://cl.ly/262l021Z1X15) on how it should animate. If you preview the site or publish the project, some of the animations seen here don’t display. Thanks again for helping out.


#4

Hi @cyberdave, any advice? I added a screencast as requested.


#5

I have the same problem. I have an element witch has an interaction as loop after page load.
In preview mode it works just fine. But on the live site it dosen’t work.
I have tried safari, chrome an firefox. All the same.

Anyone an idea?


#6

Hi Dave,

I’ve been posting in the forum, but haven’t had a response.


#7

sweet!

What if you separated the the preloader portion of the interaction from the intro? Tell it to play “when page starts loading” (right now it’s set to play with the rest of the intro which is set to “when page finishes loading”)

Then have the intro play “when page finishes loading”


#8

Thanks @Port_of_Folio, the pre-loader is literally just an animated SVG and background gradient, there are no interactions to play “when page starts loading”. Everything in the timed animation that happens “when page finishes loading” is what I want there. Maybe I’m missing what you’re suggesting…


#9

Hi @Nic1

Here’s a video showing the issue and how you can fix it: https://cl.ly/7b922648d2b4

Hope this helps!


#10

Thanks Brando, but as per above, the problem I’m having is that some interactions are only playing when pushing the play button in the interactions panel and not on site preview or publish. Please see this video that hopefully explains the issue: https://cl.ly/3027029fa6ff


#11

Hi @Nic1,

Looks like you have a 100% opacity animation for the Loader Element, however there is no initial state for this element:

Since the ‘Loader’ is also set as default opacity 100% on the Styles panel, it is expected that when previewing the animation in the Interactions Panel, you will only be able to see the animation itself and not the styles you defined previously.

I’d recommend adding an initial state to this element and play with the animations timeline to adjust your elements visibility.

Hope this helps :slight_smile:


#12

Hi Nita, sorry it doesn’t. The issue I’m having if you follow the thread is that some of the interactions (Eg the scaling of BIG) are only happening when pushing play in the interactions panel (see gif). They do not play when you toggle preview (eye icon top left of screen) or export the site.

com-video-to-gif


#13

@Nita @Brando @cyberdave Hey all, any update on this?


#15

Hi @Nic1

Thanks for requesting an update here.

I’ve done some more testing and can see that preview mode doesn’t always reflect what the animation preview shows.

I’ve reported this issue to the Interactions team and we’ll take a closer look to see if we can figure out what the issue is.

I’ll post back here when I have more information for you.

​Thanks in advance for your patience.


#16

Thanks Brandon, It’s now happening on a CMS template page. Here is a video: https://cl.ly/b77021773581 It wasn’t doing this before.


#17

Thanks for sharing this @Nic1 — I’ve passed this video along to our engineers so we can take a closer looks. Thanks for your patience while we dig into this one. :bowing_man:


#18

Hi Brandon, any update here? I want to launch this site in the next couple days.


#19

Hi @Nic1

Thanks for requesting an update.

I spoke with our engineers working on this. Although we can’t be 100% sure in case something crops up, they are hoping hoping for a fix this week.

I’ll definitely keep you updated. :bowing_man:


#20

Thanks Brandon, looking forward to it.


#21

Hi @Nic1

We got an update from our engineers on this one.

We were able to find the underlying cause. It looks like continuous action items are overriding timed initial action items. So basically if you have a continuous action item scale=1 , and an timed initial action item scale=3 targeting the same element, scale=1 will be applied to the element since continuous action lists take higher priority in IX2. The reason why playback was working in the editor was because timed & continuous action lists never play at the same time.

We don’t have a solution for this yet, but our team is digging into this more and I’ll definitely keep you updated.