Streaming live at 10am (PST)

Animate size/height when auto parameter is missing

Hi,
I’m trying to animate height of div/wrapper to create a reveal animation.
Before we did this with height 0px > height auto. But it is not possible to set the auto parameter anymore…

https://preview.webflow.com/preview/mittlillefrankrike?preview=91dded1f415b28aba5998b0f2c57f6bf
The test is located on the “Dager Template” page. The “Oslo” header bar has the interaction.

Please advice.

-Thor

@biodust have you tried using a Scale interaction on a certain axis?

The scale and transform origin concepts are covered in this tutorial: https://university.webflow.com/lesson/scroll-progress-indicator-interactions

Try a scale of 0 on start on y-axis only to a scale of 1 on the y-axis at the end of the transform. Transform origin should be on the top center.

That said, we’re working on the auto size parameter, thanks so much!

Thanks for answering, @Waldo.

Two challenges with scale:

  1. If I use scale, then content in wrapper will be squeezed not hidden.
  2. How to I set transform origin?

Hope auto will be fixed soon.

@biodust I’d recommend using Legacy Interactions as a workaround until the Auto size feature is available.

The transform origin setting is described at this point in the video (1 minute 56 seconds):

Ok, thanks.
Maybe legacy is the way to go for now…

Thanks @biodust! Just in case you haven’t already seen, here are some release notes of a few more features we’re working on for Interactions 2.0: https://webflow.com/blog/interactions-2-0-release-notes

I saw it. Will be awesome with interactions on CMS items :boom:

1 Like

Hi Guys, I have a similar issue and have watched the video. I’m using a size scrolling interaction on an SVG, but the SVG isn’t scaling from the center even though the transform origin of the DIV holding it is centered.

The project is here:
https://preview.webflow.com/preview/get-set?preview=160d9a5c1dbe4abb3b270a62c8246050

Interaction is on Intro Section Details and SVG is in Section BGs > Intro

Thanks for any help. A bit stuck.

Hi Waldo! Any news yet? This kind of functionality is quite useful and I’d love to not be able to use old interactions at this point.

Was redoing an interaction on a dropdown in a nav menu and ran into this height: auto issue… Ooof… Any word on a fix for this? This seems like something that would have shipped with IX 2.0?

Would love to have this fixed as soon as possible! I’m currently working on a dropdown menu with the interaction 2.0 and I have to create multiple interactions because the auto parameter is not working…