Archived topic
Image background doesn't show on iPhones
3 replies · Started by Marcel on March 6, 2021
I have a weird issue. I created a Hero Block Element, with an image in the background. On the desktop and on the Android phones it works ok, but on the iPhone, the image is no longer visible, as if I had set the opacity to 0, although the opacity is 1.
I am attaching 3 screenshots: the first is on the desktop, the second on an Android phone and the third on an iPhone. I mention that I tried to access the page on several Android and iPhone phones, and the result was the same. On the iPhone, I used both Safari and Chrome as a browser. I cleared/deleted caches, and disabled caching plugin, with or without plugin results is identical.
Image 1 - desktop: https://www.screencast.com/t/5TbH9dEUb
Image 2 - Android: https://www.screencast.com/t/eMzDtDNu
Image 3 - iPhone: https://www.screencast.com/t/okAAy76CCK
Hi Marcel,
I think it's because your background image is too large, IOS generally doesn't like large images on mobile.
Could you try a smaller image in terms of dimension and also file size?
Let me know :)
I reduced both the image size and file size, but without success. Temporarily, I decided to use a black background as a backup for the iPhone, but I'm not 100% satisfied.
Indeed, you're right, iOS doesn't like large images on mobile. At least I found out what the cause was, I thought the site had something broken.
Thank you, Ying!
You are welcome :)
