Can someone explain how background-attachment is used in css
Hello, can someone explain how background-attachment is used and where please.
I tried to experiment with it a bit:
https://codepen.io/Fakeur/pen/YPXqzQd
But I didn't understand for the
scroll
, like we say that the background scroll together with the page but when I scroll the entire page, nothing seems to happen.
For fixed
, it's a bit confusing, we say it's attached to the viewport, it is supposed to move?
local
means it scroll when we scroll the content in the container itself. By the way, the local value has many use case, no? I see I often see things like that on the web, like while we are scrolling down, an image is kind of moving, I don't know if it's a parallax effect or something else though :c.5 Replies
https://developer.mozilla.org/en-US/docs/Web/CSS/background-attachment <-- have you tried reading this?
will have a look and come back 2min
I'm really confused about the
fixed
value, here in the MDN example:
https://mdn.github.io/learning-area/css/styling-boxes/backgrounds/background-attachment.html
Using fixed
makes the element move if we scroll entire page, why in the example in the link you gave, it doesn't seem to move though :cit's fixed to the viewport
not the element
oh ok I see
By the way, the background-attachment of local, I think it's widely used nowadays no? I think I saw on many websites, when we scroll, the background picture scroll down together
i think that that's the default value