Hello TheBearded

Please follow this documentation and apply the settings on your iPad Pro.

Best regards

Hell Ofi,

thanks for your response. Unfortunately, this does not solve the issue.

I see wrong scaling of background pictures in landscape mode. Also SPPB seems not to recognize the iPad as a tablet - it displays desktop rows, which might also be part of this issue.

Please kindly provide further assistance to solve this issue.

Thanks and best regards, Ben

Okay, I would like to investigate the issue further. Please share the page link to check. If you want to share privately, then share in the hidden content box.

Hello Ofi,

I have provided login data in the hidden content box. The whole page is password protected as it is still under construction, I have provided all necessary login data in the hidden content area.

Thanks and best regards, Ben

Hello Ofi,

were you able to make progress with this issue?

Thanks for a wuick update and best regards, Ben

Hello,

may I kindly ask if there has been any progress on this issue? Please let me know how this issue can be fixed.

Thanks and best regards, Ben

Apology for the delay. Please check this page (on the hidden content) and let me know if your issue is solved or not.

Hello Ofi,

thanks for looking into the issue. Unfortunately the page looks the same on the iPad as before.

It still looks like this: https://imgbb.com/L1Pm5jh

Foir me it also looks like as the iPad would not be recognized as a tablet by SPPB, it displays the desktop version of the content...

Could you kindly follow up again? Thank you!

Best regards, Ben

The page is displayed according to the screen resolution. If it is bigger than the usual tablet screen resolution, then you might have seen the desktop view. Please explain it more. Check it with different browsers on the iPad. If possible, then share your iPad model too.

The device is an iPad Pro 2018 with 10.5 inch screen (resolution 2224 x 1668 Pixel).

In landscape mode, it definitely shows the desktop version of the page - in portrait mode it shows the tablet view. I also checked this in Chrome on the iPad, the behaviour is the same.

Is it possible to change the SPPB behaviour that it shows the tablet view on a tablet? I would not consider the resolution of a four year old tablet as very unusual.

Besides that, the original problem with the parallax scroll effect and the wrong scaling of the background image is also still open. For the productive page I now had to remove the parallax effect, but I would love to use it and display it also on desktop, tablet and mobile.

Unfortunately, one year later this issue still persists.

SPPB somehow seems to recognize the iPad Pro 10,5" in landscape mode as a "desktop" and shows wrong scaling of images.

Please investigate in fixing this, it is a massive issue.

This is a general, well-known issue and limitation on iOS devices/Safari browsers. Basically the involved CSS properties render the background for the entire screen height. Although it should take the height/width of the container into account... which holds the actual background image.

Probably this can only be fixed by a constant re-calculation of that container and the image dimensions. Back in the days, even a javascript solution was no real option, because Apple prevented the execution during touch/scroll events. The result was a total freeze of javascript or a very choppy jerky movement.

After many years, the newer iOS/browser versions seem to allow more scripting and update during those touch events.

@Joomshaper I would like to encourage the Joomshaper Devs to investigate this further. Other companies did find some javascript workarounds! For instance "Yootheme's UIKIT". I have also seen a working effect on an "RS Joomla" template demo. I also remember "Stellar.JS + Scrollability", but it is no longer maintained. In 2022, I found the project "Universal-Parallax", looks very promising! MIT license ;) https://github.com/marrio-h/universal-parallax

Apart from Javascript, there might be even new CSS tricks to make this work...
Hope this helps to find some resources for inspiration ;)

Thanks for your feedback on this. I think parallax issue is an iPadOS issue and it might be altered by Custom CSS or Custom JavaScript. You have to find the solution for you. For the resolution, iPad might seem like desktop which is quite normal. You may check websites view like desktop on iPad. So, considering your suggestion, if we change the resolution or use Custom JavaScript only for specific device, it might create issue on another thing. The simpler is the better. We will keep the customization option open to you.