CODEWITHSUNDEEP
javascriptcsshtml
Muhammed Bhikha
Muhammed Bhikha

Reputation: 4999

Amazing CSS Div scrolling effect, cant explain, link provided. This is a web design issue, how to get an effect like this?

Here is the link to the website of the example I want to show Smokey Bones Menu. Scroll down the page and see how the divs overlap each other but its more complex than this, because the actual page is scrolling too. Would anyone be able to help in answering how to achieve this effect?

Upvotes: 1

Views: 872

Answers (2)

Armatus
Armatus

Reputation: 2191

I assume you are referring to the backgrounds of the dishes.

The effect has two components:

a) The CSS property background-attachment: fixed;. This prevents the background image from scrolling with the divs. (This is not dependent on JavaScript)

b) A JavaScript which moves the background by changing background-position slightly on scroll.

Upvotes: 4

Simon Boudrias
Simon Boudrias

Reputation: 44589

Here's plugin doing something pretty similar: https://github.com/IanLunn/jQuery-Parallax

You can search for parallax effet on Google for more example/scripts

Hope this help !

Upvotes: 1

Related Questions