Hero image doesn't display on live site

Design help General
1

Good morning everyone.

I’ve found myself with a strange issue - I have a landing page with a simple hero image that displays fine in my designer - but on the live page it doesn’t show at all. Weirdly some friends have reported being able to see the hero image while others have not.

I’ve tried removing the element and recreating it from scratch but the issue persists. I’d be really grateful if someone could take a look and point out the issue for me.

Here is my site Read-Only: https://preview.webflow.com/preview/kings-landing-page?utm_medium=preview_link&utm_source=designer&utm_content=kings-landing-page&preview=ea586a0d4cec76971307119ec85f0077&workflow=preview

Here’s the live site: https://kings-landing-page.webflow.io/

2

What browser, browser version, and OS are you experiencing an issue with? Also can you show which element you seem to have an issue with? I tested with Safari Version 14.1.2 (16611.3.10.1.6) on OS X 11.5.2 and did not see an issue as the man profile image loads.

3

I tested on Chrome and Safari and the hero looked fine. Maybe the CDN was having a brief issue, but I could not recreate the problem.

4

Got a fix! Seems to be that the hero image being set to lazy load and being set as the child as of an absolute element was causing some browsers to have trouble knowing when it should load.

All I had to do was turn off lazy loading. Upon further reading it seems agreed upon that a best practise is to turn off lazy load to all element above the fold.

5

This topic was automatically closed 24 hours after the last reply. New replies are no longer allowed.