Flip Box not showing backside

With the lagacy interactions it was easy (Build flip cards with transforms | Webflow University)… But with Interactions 2.0 it doesn’t work.

How can I flip a div block to show the backside (the rotated div behind the originaly shown div) with 2.0 interactions ?

Hi @bobmatthyssens,

could you share a Read-Only Link to your project?

Here you are : https://preview.webflow.com/preview/flip-box?preview=3f3f4e776db0790edc334b7ca3ca2e24

The problem is that you only flip the front. If you give your back card, for example, a solid color, you will see that on flip you don´t see the back with the solid color.

I flip the Flip Box containing the (turned) Back Side and the Front Side.

I made a little example for you here.

Try to rebuild this for your case and the first time without interactions only hover and after this works I would add interactions.

Made a version for Hover…
Duplicated everything and duplicated all classes…
Then I added the hover style in the first version…
… and the actions in the second version…

And this is the result : https://preview.webflow.com/preview/flip-box?preview=3f3f4e776db0790edc334b7ca3ca2e24

Alright :+1:t2:
I updated my example project. Take a look and try to adapt this to your project, hopefully, this works for you.

That’s a work-around… You rotate both sides separately.

My flip

  • is defined on a class
  • is part of a bigger action
  • is started by an external object

so I wan’t to flip the card as one object. This is not working.

Thanks, Maurice… But I think it’s a bug.

Yeah, I think it has something to do with IX 2. Maybe somebody else has a clue if it is a bug?