August 31, 2013 at 4:04 am #28758
Updated one of our enfold pages to use a colour section with a background image as fixed. Looks great on a desktop, however it doesn’t seem to work on iPad or iPhone as well. The image in the colour section is there, but it’s just a section of it and it scrolls, rather than stay fixed.
Any ideas for a fix?
Thank you.August 31, 2013 at 4:18 pm #138539
Can you give us a link to the website? Do you have the latest version of Enfold, 2.0.1? If you have any plugins installed, please deactivate them first. Let me tag Devin to check this through.
IsmaelSeptember 1, 2013 at 3:31 am #138540
the site is http://www.marsmarketing.com.au, yes I’ve got the newest version I believe.
I’ve only got a few plugs like Yoast, and have disabled and checked, but I still have the issue.
Many thanks for looking into this.
Thanks.September 1, 2013 at 3:33 am #138541
It might help if I gave you the specific page… here’s the link http://marsmarketing.com.au/sme-marketing-brisbane/
Thanks guys,September 2, 2013 at 4:00 am #138542
Looks like the color section is working. It’s just that the sky in the picture is too large for mobile devices and it looks like it is not moving.
IsmaelSeptember 2, 2013 at 6:04 am #138543
It looks fine in the link you sent, but when it’s on an actual iPad or iPhone it doesn’t appear correct (The image in the colour section is there, but it’s just a section of it and it scrolls, rather than stay fixed).
If the picture is too large as you suggest, what size do you recommend reducing it too?
Thank youSeptember 3, 2013 at 5:23 am #138544
Let us wait for Devin and Kriesi to answer. They can check this on an actual iOS device.
IsmaelSeptember 3, 2013 at 10:11 am #138545
Sorry to jump in but I am experiencing exactly the same problem. In the emulator everything appears fine but testing on actual mobile devices the images appear static. What is the optimal image size for the fixed colour section? The page I am having problems with is: http://reflection.boa.ac.uk/
ThanksSeptember 3, 2013 at 11:55 am #138546
For mobile, its best if you set the image to be fixed in the Center vertically and horizontally. So Center Center for the position option.
I believe there is/was a bug for fixed images in iOS which is why it isn’t showing as fixed in iOS in the example links.
DevinSeptember 3, 2013 at 11:26 pm #138547
Hi Devin, thanks for getting back to us.We’ve tried your suggestion, and it didn’t seem to to work. I’ve placed the image centre centre this is the result.
Desktop is great and shows the image as before
iPad / iPhone, since making the change it now shows no image and is showing a ‘main content’ colour
Did we make the correct change?
Not sure how http://reflection.boa.ac.uk/ went with their change? (Nice site btw, love the banner)
Many thanks Devin.
Mars.September 4, 2013 at 2:27 pm #138548
Hi Devin, our images are also set to Centre Centre. I did try a very small, low resolution image and set it to repeat. The result of this is a fixed image but only for the first two scrolls down the page. When you touch the screen for a third time the image moves with the page.
From your comment about an iOS issue I did some searching and found several posts regarding iOS and ‘position:fixed’ –
Do you think this the issue? I noticed ‘background-attachment: fixed’ is used within the CSS. If so do you have any suggestions to resolve it?
(same to you Mars, nice use of the fixed image/price box combo!)
BOASeptember 5, 2013 at 4:32 pm #138549
Hey! I think I found a solution that should work on mobile devices. Will update the theme later today, let us know if it solves you issue. The enfold version is 2.1
KriesiSeptember 5, 2013 at 10:24 pm #138550
The topic ‘Colour Section & Background Attachment Mobile Devices’ is closed to new replies.