Urgent: Safari not displaying animations for navigation / CTA

Community resources Bugs
1

Just launched a new site and discovered a serious bug:

The animations that display a navigation, logo and CTA on scroll are not running in Safari. Nor is a flyout menu that slides in when you click “Startup Verticals” in the primary nav.

Everything works great in Chrome. Nothing works in Safari.

Here is the site:

Here is the preview link:
https://preview.webflow.com/preview/vouch-brand-refresh-67bc5-1867061c16988?utm_medium=preview_link&utm_source=designer&utm_content=vouch-brand-refresh-67bc5-1867061c16988&preview=8546f292483851d37f67eb0981787ac0&mode=preview

I think it may have to do with the configuration of initial state? I think others may be having Safari bugs, too? Any help or tip or workarounds would be appreciated, even if they are quick and dirty hacks. Will pay bug bounty via Venmo!

Thanks Webflow community!

2

Bumping for more visibility.

It appears another user has the same problem and consequence: Dropdown nav not working properly in Safari

Anyone know if this is a new bug and whether we should devise workarounds or wait for a fix?

3

I’m not seeing any error. It works the same for me in both Chrome and Safari.

How many people have reported this error? Is it every Safari user?

4

Hey @joejola,

Thanks for getting back to me. You are the first person to report that it DOES work in Safari. To be clear: this is desktop safari only. Animations work properly on mobile.

I am on Version 13.1.2 and none of the click-based animations are working on the site. What version are you using?

The console is reporting a jquery error “document.body.appendChild” which is likely related as it doesn’t appear in Chrome.

Cassidy

5

Interesting. I’m running on Safari 14.0. Can you send a short video of how it looks for you?

Also, which browser did you design the site in?

6

Hey @joejola

Video here: https://streamable.com/rg3zex

The site was designed and deployed from Chrome.

Best,

Cassidy

7

Try using the designer in Safari. Test and publish through it too

8

@joejola Thanks for the tip! This is a breakthrough!

The div that all of these animated navigation features live inside does not appear in the designer in Safari at all. I can’t make it show up. This must be the underlying cause of the animation failure. The elements are simply not in the DOM.

Did you peak in the webflow designer link? Any ideas why that might be the case?

Cassidy

9

It’s not uncommon, this has happened to me before. I’m not sure which interactions aren’t cross-browser compatible. But from what I can tell, IX2 is where the issues lay.

I recommend you rebuilding it in Safari. Best practice is to achieve the interaction in as few steps as possible. It makes it easy to for the browser to compile and for you to troubleshoot when there are issues.

10

This topic was automatically closed 60 days after the last reply. New replies are no longer allowed.