Make nav bar opaque when scrolled down

Design help Layout & Design
1

I am trying to make navbar opaque when scrolled down.

I tried transitions and interactions but some like it is not working.

Can some one help me with this issue

Here is my site Read-Only: Webflow - Sarthak's Dynamite Site

2

I see that your nav is already opaque white and against a white background. Can you explain exactly what you’re trying to achieve?

3

@Port_of_Folio . If you check the Nav bar at section with logos(Screenshot attached). The nav doesn’t look opaque. Also dropdown menu has same issue when I hover at passing on this section.

image
image1906Ă—663 22.9 KB

4

Looks more like a z-indexing issue. See screen grab showing how the logos are on top of your nav.

overlap
overlap2059Ă—476 68 KB

5

Yeah, you have a high z-index on the navbar but it’s inside of another div called “page wrapper” that has no z-index set. Try applying the z-index on the parent element.

1 Like
6

Thanks! Its worked perfectly