Fixed position in Chrome and Firefox + Firefox interaction speed

Hi Guys! Long time listener, first time caller.

So, I’ve just finished up my Agency’s site, and I’ve run across two bugs I’ve never experienced before (webflow or otherwise).

The fixed hamburger icon and menu (when expanded) do not stay fixed in the viewport. This only occurs in Chrome and Firefox, but behaves as expected in Safari and Opera.

I’ve tried multiple attempts at a fix for this. I found a reference to this on stackoverflow.

Applying this to the element, as suggested, does not fix the problem:

transform: translate3d(0px, 0px, 0px)

or

transform: translateZ(0);

Has anyone experienced this before? Any ideas for a fix? Have I been staring at this too long and missing something simple?

My second issue is animation and scrolling on Firefox. It looks fine in any other browser, but in Firefox the site is barely scrollable. I know I went a little all out on animations, and have some other JS loading in, but any idea why this is occurring? Should I try to optimize my interactions better?

Any help is much appreciated. Thanks in advance.

-Justin


Here is my site Read-Only: https://preview.webflow.com/preview/brandengine-v2?utm_source=brandengine-v2&preview=2d5277852aa363da51bebfc56243a10d

So, if anyone else ever comes close to losing their sanity over similar issues, I figured out the fix.

I had a saturation filter on the body. Removing the filter fixed both issues.