htmlimagecssparallax

Parallax css background image move a little

I have my background image from background-url and my parallax works for the image when I put: background-attachment: fixed;

How can I make it so that the background image moves a little bit when I scroll?

Here is the examples I'm talking about:

This is what I have now when I scroll: http://www.w3schools.com/howto/tryhow_css_parallax_demo.htm

This is what I want when I scroll: http://materializecss.com/parallax-demo.html

Solution

  • Maybe this link will help it uses Javascript to move the background image

    EDIT

    I just realized this only works because the background image is a repeating pattern. If you want to do this effect with a normal image you can use Parallax.js.