Streaming live at 10am (PST)

How to make parallax background


#1

I want something like that: http://www.jqueryrain.com/?AaF5WbuX


#2

Mate I am very sorry to say this, but there are so many wonderful threads about this topic. The search feature is your friend.

http://forum.webflow.com/t/parallax-without-code-no-copy-paste-no-custom-css-no-custom-js/13981

http://forum.webflow.com/t/webflow-codes-tutorials-updated-with-parallax/12796/13

http://forum.webflow.com/t/how-to-make-parallax-elements-in-webflow/7481

Another solution would be google:
just insert this code within google search

webflow parallax scrolling site:forum.webflow.com

#3

Use @PixelGeek 's post


#4

This is why i created this topic. You gave me only parallax scrolling. I want the section with parallax background. In my example background changes the angle.


#5

I did his example but it's not i need.

All i need is the simple moving of background to the left and to the right cause of mouse position + changing angle when mouse is closed to the right of left end of page. I don't need a lot of elements. That's not difficult script but i didn't find how to make it in webflow.


#6

Well its not 100% accurate and relies on a well produced background image. But I dont see how the links above could not create such an element:

http://sandburg.webflow.io/

You can see my dirty workaround here:
https://preview.webflow.com/preview/sandburg?preview=e3eea8fd4ab3fabcdb72d034c5cbc09b

BUT the script relies on the fact, that you structure it like a list. Not as a background image.
Trick is to set a div with overflow:hidden as an outside container. Within that you ll have the list with one list-item holding the background image.

It is not 100% what you ll need but a workaround if there is no better solution out there.

I only used this workflow shown by pixelgeek:
forum.webflow.com/t/how-to-make-parallax-elements-in-webflow/7481


#7