Streaming live at 10am (PST)

Fixed background image in mobile


#1

I have a background image that is fixed. it works great in the previews, but when i view it live (on my iphone), the background image isn't fixed & it is enlarged. http://blueline.webflow.com/explore

does anyone know how i can fix that?

thanks!


#2

Found this on the forum, from @callmevlad

callmevladWebflow StaffJan 6 1
Hi @zfe - thanks for the question! At the moment, Webflow automatically disables background-attachment: fixed; for mobile devices because IOS7 has a rendering bug that makes them appear completely distorted in certain situations.

Are you exporting your site or hosting on Webflow? If you are exporting, there is a workaround I can suggest, but it might cause your background images to be broken on other devices (e.g. iPad landscape), especially if you set your background size to the 'Cover' setting.

(See this thread for a bit more background: http://forum.webflow.com/t/fixed-background-picture-doesnt-work-on-iphone5-safari/1222)

I have the same issue than you so I design for mobile differently.


#3

I was aware of the Safari bug, but didn't realize Webflow automatically disabled background-attachment: fixed. Thanks for the post @vincent! I had been wondering the same thing.


#4

We are going to export it, but I dont want to mess with how it looks in other devices.


#5