Background image not fixed as it should
-
Hi,
My website is designed using Elementor and the Sydney theme.
There is some strange behavior as to how the background is displayed depending on the device and what seems to be related to screen resolution and possibly also the orientation.
Let me start by briefly describing how the page is designed and what the intended behavior is:
– The page has a number of sections, each holding text, and with an associated image.
– In between these sections are added spaces to create additional sections that each contain the same background picture.
– The background picture has size 1784 x 915 pixels
– The spaces are 100 pixels high
– The intention is that, as you scroll the page, the sections with text and image will move up/down while the background remains fixed, thus creating an effect where various parts of the background will be revealed.Now, the web page behaves differently depending on the device used in a partly inexplicable way. Here is a summary of my findings:
– When viewing the page on a laptop or desktop the background image remains fixed (as intended) if the screen resolution is 1920 x 1080. Any other resolution will cause the background image to scroll, which is not intended. I have tried on various computers with screen resolution up to 1920 x 1080, both Windows and iOS.
– When viewing the page on a Windows desktop that has a 4k screen, the image scrolls regardless of resolution. Setting to 1920 x 1080 does not fix the image, as is the case with the other computer devices I have tested on
– When viewing the page on a mobile phone (Android and iOS) the background image scrolls. I suppose that is as expected, by reading the note in Elementor which says something like “Fixed attachment only works on computer” (translated from my Swedish edition of Elementor).
– When viewing the page on an iPad, the background image always scrolls. I suppose that is as intended. In
– When viewing the page on an Android tablet (Samsung Galaxy S5e, resolution 1600 x 2560), the image scrolls (as expected) if the device is in portrait orientation. If the device is in landscape orientation, the image is fixed, which is nice but not supposed to work according to Elementor.Any guidance on actions needed to achieve consistent behavior across devices, resolution, and orientation is highly appreciated. I am still in a learning process so asking the forum before changing settings or design without understanding the impact.
Best Regards,
Tord AndreassonThe page I need help with: [log in to see the link]
- The topic ‘Background image not fixed as it should’ is closed to new replies.