Анимация Navbar Mlickering только на устройстве iOS ⇐ Javascript

[Anonymous]

Это для компонента Navbar, который отображается только после того, как пользователь прокручивает в определенном разделе. /> Как появляется Navbar, он мерцает. Подобно, как исчезает, мерцающие. < /P>
Почему? Есть ли способ исправить это? < /P>
// Minimized the component just to have a reference.
// Navbar.jsx

const NavBar = () => {
const showNav = useScrollTrigger(ref);
return (


There are links, images, buttons in this body


);
};

// This is the existing styles.
// NavBar.scss

.container {
display: flex;
position: sticky;
top: 0;
z-index: 10;
overflow: hidden;
// lots of other padding color margin styles

opacity: 0;
margin-bottom: -60px;
visibility: hidden;
transform: translateY(-100%);
transition: opacity 0.3s ease, transform 0.3s ease, visibility 0.3s; // have tried removing this, same outcome.
}

.show {
opacity: 1;
margin-bottom: 0;
visibility: visible;
transform: translateY(0);
}


Подробнее здесь: https://stackoverflow.com/questions/797 ... ios-device