Streaming live at 10am (PST)

(SOLVED) Workaround or better solution for flip animation


#1

Hey fellow Webflow creators :wink:

I made a website (not my design, make sure to wear protective goggles!!) for my customer:
https://www.optimal-lernen.de/

share link: https://preview.webflow.com/preview/norbert-schnierle?preview=04478e2f8ffa9d8700afc3f1b3d5dc5b

The problem:
These flipping cards (made up from collections, with this tutorial from webflow https://university.webflow.com/article/3d-card-flip-animation) have links on their rear side, which can’t be accessed in IE11:

ie11

This is how’s supposed to work:
normal

Unfortunately the customer’s user base uses this browser a lot.

My question:
How can I either make it work in IE11, or how – alternatively – can I show a different frontend for IE11?

I’m not a developer but I have seen that this simple but ancient way of detecting it with HTML-Snippets like<!--[if IE]> doesn’t work any more after IE9.

Or maybe there’s a better way to create the flip animation in the first place, that’ll also work with IE?

Any feedback is highly appreciated as the customer is putting pressure. Thank you!


#2

In the end I solved it with a script, that shows an entirely different page to IE, using @Daniel_Schultheiss script I found here: 3d transform not working on IE10/11