I have a header element and I want it to move up (disappear from view) when I scroll down the page, and move down (reappear into view) when I scroll up the page. I tried using the “element watch scroll position” with the “on page scroll” trigger, but it only returns the final position and not the initial.
could you keep track of the initial position yourself? have a var start at 0 if the user scrolls down compare the var to the final position of the scroll and use this condition to show or hide the element, and then set the var to the final position of the scroll. so on next scroll its based on that
That was my initial idea bur the “On page scroll” only returns the final position. If I uodate the var inside this trigger it will always show the final position.
can you give more details? if you have a separate var that you compare to the the final position of the page scroll you can then toggle your other var to show the header
so you would have 3 vars the page scroll finalPosition the oldPageScroll position and ShowHeader. finalPosition > oldPageScrol showHeader = false else showHeader = true
My point is that I don’t have the initial position after the first scroll.
For example:
I load the page with the var “initialPosition” and “finalPosition” equal to 0.
When I scroll down the page, I trigger a workflow with the “On page scroll” trigger and inside this workflow I update the “finalPosition” to the screen-y value. Since the finalPosition will be bigger than the initialPosition, the element will disappear. (note that I cant update the initialPosition because the only value I have is the final screen-y value)
When I scroll up the page, I’ll trigger the workflow again but my initialPosition is still set to zero. Therefore, the element will not reappear.