Let me see if I understand what you need.
You have a navbar that initializes hidden - fixed position top.
You have (about) 2 or 3 sections of information displayed in sequential order.
The navbar basically appears when you scroll down the page… perhaps somewhere in section 2.
When someone clicks on the navbar… a subnav appears.
You want the subnav to remain open as you scroll towards the top of the page… where it then automatically closes… and maybe the navbar will display.
If that’s what you want / need… then the outline (bellow) is “roughly” what I would do.
fixed top navbar… initial opacity 0
fixed top subnav margin-top = height of navbar +1… initial opacity 0
section 1
---- section 1 will contain a div 100% absolute bottom 25% height… call it div 1
---- div 1 will have an onHover and onScroll trigger that will hide subnav
section 2
---- section 2 will have onHover and onScroll triggers that make navbar visible
---- section 2 will contain a div 100% absolute top 25% height… call it div 2
---- div 2 will have an onHover and onScroll trigger that will hide div 2
section 3
---- section 3 could use the same onHover and onScroll trigger that section 2 uses