I'm trying to implement CSS "background-attachment: fixed" effect on iOS, but faced with problem when user scrolling content, image flickering ( sometime ) and can't understand why it happens. I used the hack from this article https://css-tricks.com/the-fixed-background-attachment-hack/
position: fixed;
top: 50px;
left: 0;
z-index: -1;
width: 100vw;
height: 100vh;
background-image: var(--cover);
background-position: top left;
background-repeat: no-repeat;
background-size: 100vw;
transform: translateZ(0);
will-change: transform;
@media screen and (max-width: 425px) {
background-image: var(--mobile-cover);
}
Maybe someone faced with such problem and know how to fix the problem? One important moment, I use CSS variables for images