My client’s homepage (in progress) is experiencing some weird jerking behavior when scrolling from top to bottom. The body background has a fixed image, size set to cover - the page is divided into sections. When you scroll top to bottom, it gets overlain by a gradient and an image in different sections, then back to the body’s fixed image. The sections are each set to 100vh height. From what’ve noticed, this only happens on Safari on Macbooks. So I know this may sound silly, and Macbook has had this issue in the past, but it wasn’t there before. And the biggest factor for me solving this is that my client has a Macbook and uses Safari.
So I have tested this with Chrome, Firefox, Opera, and Safari (Edge on mobile), on 24" monitors w/ Mac Mini, iPad, iPhoneX, my 13.3" Macbook pro, and a laptop with 15" Ubuntu for good measure.
Some of the other users on here have posted similar topics, but nothing that quite fixes my problem.
Only on Safari on the Macbook does this happen!!! Help!
Thanks in advance,
Here is my site Read-Only: https://preview.webflow.com/preview/academy-drinks?utm_medium=preview_link&utm_source=dashboard&utm_content=academy-drinks&preview=bdd4ce295723b66e1944fbfe17bfabdf&mode=preview