Page jump in Safari

Design help General
1

Hello,

I’m trying to eliminate an irritating page jump issue with Safari.

I thought it might be the font-load issue, but setting a .wf-loading opacity to 0 hasn’t fixed it.

Could it be something more fundamental with the way I’ve built some of my elements?

If anybody has a minute, I’d be grateful.

It loads like silk in Chrome.

Thanks,
Will

<style> 
.wf-loading * {
    opacity: 0;
}
</style>

http://willprice.co.uk

2

It’s important that you set the loading of all the images that are on top of the page to Eager.

CleanShot 2023-04-05 at 18.55.20@2x
CleanShot 2023-04-05 at 18.55.20@2x1920×644 97.7 KB

1 Like
3

Thanks, Vincent, I had no idea.

It has improved significantly, but I still get a jump and a flicker in Safari, even on cached pages.

I wonder if my show/hide mobile nav element is causing it. Would some “waitLoad()” script for Safari solve this?

It’s not a huge deal; I can live with it, as it works perfectly in Chrome. But Safari users are probably a big chunk of my audience.

Thanks for your help, by the way.