Which Animations / Interactions are Mobile-Friendly?

[mswish (matt)]

Hello,

I’m curious to know which animations / interaction features of Webflow I can expect to work with mobile browsers and web views for smartphone applications. It seems that some work perfectly fine, while others do not. I cannot discern a pattern here… If you can help me figure that out, it would be appreciated.

---

Here is my site Read-Only: LINK
(how to share your site Read-Only link)

[miekwave (miek)]

Hi @mswish

The most common IX2 animations are 2D Transformations and Filter Effects.
These work fine with Modern Android and iOS Browsers.

You can find compatible browsers below and optimize your pages accordingly.

https://caniuse.com/#feat=transforms2d
https://caniuse.com/#search=filter

^ Most common browsers (>98% on most websites) are Firefox, Chrome, Sifari, iOS Sifari Chrome Android and Android browsers.

For incompatible browsers, or IE in particular you can submit a validation rule that redirects non compliant browsers in the code section of the page(s), for example:

<!--[if IE 9]>
<script type="text/javascript">
window.location = "http://www.my-webflow-website.com/ie9-folder/ie9-page";
</script>
<![endif]-->

Where your /ie9-page strips all IX2, but your main pages will maintain IX2

It seems that some work perfectly fine, while others do not. I cannot discern a pattern here… If you can help me figure that out, it would be appreciated.

Can you please post example of which ones are NOT working for you?

[mswish (matt)]

Right now, this animation here:

https://preview.webflow.com/preview/zine-heavy-animations?utm_medium=preview_link&utm_source=designer&utm_content=zine-heavy-animations&preview=a817d27733487b8fa038286bd89e2f13&pageId=5d3627ba918b282380b26272&mode=preview

I really need to figure out which ones will behave in my Swift iOS app, which uses WKwebview to display these pages.

It seems this animation does not seem to work in iOS Safari either, although it was at one point last week.

[rileyrichter (Ben Parker)]

Hello, @mswish!

Ben here with the Webflow Customer Support Team! Can you provide some more information about what’s not working for you?

Would you be able to use a tool like Cloud App to provide me with a short video about what you’re seeing?

Looking forward to hearing back from you so I can help you solve this issue!

[mswish (matt)]

We are building html pages with webflow animations, that are being served from mobile itself. We are using iOS’s WKWebView to render the html. Not all animations are working in that WkWebView, compared to Safari or Chrome on mobile. I want to check what kind of webflow animations are supported with WkWebView .

[mswish (matt)]

I tried downloading your page here to see which animations / interactions behave nicely and which ones do not:

Website interactions and animations | Webflow

I want to open it up within my app’s WkWebview. Unfortunately the animations were not saved along with it, do you know if I could possibly get a copy to serve from mobile?