Streaming live at 10am (PST)

Mobile DIV Background Image Not Fixed?


#1

I am trying to have my mobile site work just like my desktop site. When I go on my desktop version the background of my div elements slides perfectly as I was hoping, however on my mobile they are not moving and I have them in the same position style as my desktop version. Someone please help me on this as the site is due to launch very soon.

Link to Shared Project: https://preview.webflow.com/preview/stscincy?preview=2faebed13c01582e8160e90969acb5b0

Link to Live View: stscincy.webflow.io


Fixed bg is not fixed on Laptop with Touchscreen
#2

Someone please help me. @cyberdave are you available?

I would like my section backgrounds to have the scrolling feature my desktop version does. I can't seem to figure out why it doesn't act like my desktop version with the image backgrounds on sections 1 and 3..

Thank you in advance,

Sean


#3

Hello @seank

Unfortunately, browsers on mobile devices do not support fixed background. I am sorry.

Cheers,
Anna


#4

Thank you for responding @sabanna but how do you suppose this site does it on their mobile.

Atomic Picnic


#5

There is no fixed background. That effect calls PARALAX and it is using javaScript for move different images/layers with different speed.


#6

@sabanna, thank you so much. Do you think webflow will be adding this in the near future?


#7

I think you can find examples of code for paralax in internet. Then just add that code to the embed widget or to the custom code area of the page, depends how tutorial will say.

I did not use such effect so I can't provide more details, sorry.


#8

About adding this to Webflow I don't know. We all hope on many new features smiley And I am sure Webflow team know about user wishes, so crossing fingers smile


#9

@sabanna May I ask you one more thing. I want my footer to stick at the very bottom, but I am having problems making it do just that.. any tips?


#10

Well, it works the same way like sticky navbar, just different "aligning"

1) pick the element that is your footer (I wasn't sure which one it is),
2) give it position = fixed, align to the bottom

3) gave it some height and background color

That's pretty much all.


#11

This topic was automatically closed 60 days after the last reply. New replies are no longer allowed.