Doesn't work for another container from body.

[volodymyrmilovanov2022]

Hello
I've faced one issue - if we don't put our header in body directly, but in some other container, which has it's own scroll, everything stops working. It is caused by that fact that we listen for window.scroll event and check for window scrollY
Changing
window.addEventListener('scroll', onScroll) to parent.addEventListener('scroll', onScroll)
and
const scrollTopPosition = window.scrollY to const scrollTopPosition = parent.scrollTop
fixed this issue.

What do You think about such improvement? Maybe You can add one more parameter, such as ScrollParent,which will be window by default?

[FilipChalupa]

Hello. You are correct. The hiding header is right now limited to window scroll only. I will investigate how hard it will be to respect other scroll parents but I expect some challenges. I will test the code you suggested first. Thank you.

[FilipChalupa]

Do you have by any chance a small example I can test the new feature on? I'm not exactly sure what you are trying to achive. Part of the hiding-header relies on position: sticky which may not even be possible to recreated in nested scroll container but it depends.

[volodymyrmilovanov2022]

https://stackblitz.com/edit/vitejs-vite-ky42v2wk
Here i can see, that my solution is also buggy. It is located in hh.ts file. Don't know why, but in my project it works. As far as I see)

[FilipChalupa]

Thank you very much. It is very helpful. Now I understand the problem better.