Hi,
I have a horizontal scroll section on my site with 12 phone screens laid out next to each other. These are made with two image overlays and a background video set to play on hover. This works fine in Chrome but on Safari one of the images (the PNG for the phone case) keeps flickering on and off as you scroll through. I’ve narrowed the issue down to the Background Video. When I remove this element the bug doesn’t happen. The bug still happens when I remove the hover interaction so it isn’t that. Can anyone think of a workaround for this?
It’s also strange that this works perfectly on Chrome, but not on Safari.
Please can anyone also let me know if you can see this bug on your own computer and what browser you are using?
Any help would be much appreciated!
Here is the read-only file: https://preview.webflow.com/preview/metastory-app?utm_medium=preview_link&utm_source=designer&utm_content=metastory-app&preview=ec1d2d2ccf799dede7fac61e681be23b&mode=preview