The community member is looking to track a user's scroll depth on their webpage using JavaScript and store that value in a variable. They are having trouble determining the best place to insert their custom code and how to integrate it with their existing data variable. The discussion in the comments suggests using position: fixed and adding an HTML embed script with a scroll listener to set the opacity based on the current scroll position. Another suggestion is to use position: sticky for the navigation bar, placing it after the hero section and setting top: 0 to make it stick. The community members agree that the position: sticky approach is simpler and more effective.
I’m looking to track a user’s scroll depth on my webpage using JavaScript and store that value in a variable. However, I’m having trouble determining the best place to insert my custom code and how to integrate it with my existing data variable. Could you provide some guidance on how to achieve this?
Are you sure this is the right approch? Doesn't this still leave the nav bar visible all the time? What I want to achieve is that on the hero section, the nav bar is hidden
Using sticky is a good idea, but I can't seem to get it to work. Placing it under the hero section with position = sticky, it doesn't seem to stick: https://www.getcodeless.tech/
