Wrong Background Image Size and Browser Behavior

There is a difference in the background in desktop browsers and in the Safari for iPadOS. The desktop browser shows the correct size for the background images (attachment 1), and the iPadOS landscape mode shows very large background images (attachment 2). Please advise on how to make the site display the right background size for iPadOS. Also, the site stutters when using Safari for macOS but not Chrome or Firefox (attachment 3).

Attachments:

You must be logged in to view attached files.

Please disregard attachment 3 because I cannot upload a video of it.

Hello,

Here is the screen how it looks on iPadOS https://prnt.sc/rpgef4 this is the real device, no emulator, as you can see it looks correctly.

Please check this https://woodmart.xtemos.com/layout-parallax/?opt=layout_parallax on your device, does it work well?

Best Regards

The screenshot I sent you was from a real device as well — iPad Pro 11″. This is another screenshot (attachment 1), and as you can tell, the background image is very large (attachment 2).

Also, Safari for macOS is stuttering when scrolling the sample website above.

Attachments:

You must be logged in to view attached files.

Hi,

By default background parallax effect is created with background-attachment: fixed CSS parameter. We have investigated that issue and found that the Safari browser has issues with supporting background-attachment: fixed; (https://forums.developer.apple.com/thread/99883). Unfortunately, that can’t be fixed via WordPress theme and we didn’t have a quick solution for this.

As a solution you can add the following code snippet to the Custom CSS area in Theme Settings to disable background parallax in Safari browsers:

.browser-Safari .woodmart-parallax {
	background-position: center !important;
	background-attachment: scroll !important;
}

Best Regards

Thank you for the workaround. Please let me know when there is a permanent solution to this. The parallax feature is what I am after to begin with.

Hello,

We will let you know if it appears. If you have any questions please feel free to contact us.

Best Regards

[Author]

Posts