Make background dark when nav appears
say I have the following codepen
https://codepen.io/-bloop-/pen/yLxdJNj
if u click the coral coloed square, the navbar will appear
how can I make the whole body barken up when the navBar appears??
7 Replies
I've tried decreasing brightness() for thr body but it seem to only effect images
the overall body doesn't get darken up
you're looking for something that's usually called a curtain. Use a div that covers the whole thing and has a background with an opacity set on it
background-color: rgb(0 0 0 / 0.4); for exampleaaah
i was literally about to do that šš
but tnx for assuring me tnx
i was like : idk if it's gon work..but woth of try
@jochemm and how can I make so when nav is opened user can't control the background
like, when the nav is opened, and u scroll the background scrolls up or down correspondingly, how do I stop that
I'd think twice about doing that honestly. Though if you can only open the nav when the page is at/near the top anyway, you can just set overflow to hidden on whatever container is appropriate, and remove it again when the nav closes
yaa i just did that
i first tried setting position fixed for the body
but it snaps to the top when nav opnes
but then i tried overflow hidden
and apparently it works fine
tnx
ā¤ļø
but why did u say, you'd think twice
like is it bad?,
I wouldn't say bad, but I usually prefer to not take away functionality from users
there's no real harm in being able to scroll, but also nothing terrible about turning it off
mostly just preference I guess
hmm gotcha xD
tnx anyways