# Translate based on element scroll position **URL:** \ **Category:** How do I?\ **Created:** [July 3, 2025, 9:22pm UTC](https://community.weweb.io/t/translate-based-on-element-scroll-position/19076 "2025-07-03T21:22:26Z")\ **Posts on this page:** 8\ **Page:** 1
**Author:** ![HeFur](https://avatars.discourse-cdn.com/v4/letter/h/34f0e0/32.png) [@HeFur](https://community.weweb.io/u/HeFur)\ **Post date:** [July 3, 2025, 9:22pm UTC](https://community.weweb.io/t/translate-based-on-element-scroll-position/19076/1 "2025-07-03T21:22:26Z")
Hello, 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. Any ideas on how to do this? ---
**Author:** ![sam1](https://sea2.discourse-cdn.com/flex016/user_avatar/community.weweb.io/sam1/32/6724_2.png) [@sam1](https://community.weweb.io/u/sam1)\ **Post date:** [July 3, 2025, 11:48pm UTC](https://community.weweb.io/t/translate-based-on-element-scroll-position/19076/2 "2025-07-03T23:48:18Z")
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 ---
**Author:** ![HeFur](https://avatars.discourse-cdn.com/v4/letter/h/34f0e0/32.png) [@HeFur](https://community.weweb.io/u/HeFur)\ **Post date:** [July 4, 2025, 4:33am UTC](https://community.weweb.io/t/translate-based-on-element-scroll-position/19076/3 "2025-07-04T04:33:19Z")
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. ---
**Author:** ![sam1](https://sea2.discourse-cdn.com/flex016/user_avatar/community.weweb.io/sam1/32/6724_2.png) [@sam1](https://community.weweb.io/u/sam1)\ **Post date:** [July 4, 2025, 4:59am UTC](https://community.weweb.io/t/translate-based-on-element-scroll-position/19076/4 "2025-07-04T04:59:45Z")
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 ---
**Author:** ![sam1](https://sea2.discourse-cdn.com/flex016/user_avatar/community.weweb.io/sam1/32/6724_2.png) [@sam1](https://community.weweb.io/u/sam1)\ **Post date:** [July 4, 2025, 5:01am UTC](https://community.weweb.io/t/translate-based-on-element-scroll-position/19076/5 "2025-07-04T05:01:29Z")
so you would have 3 vars the page scroll finalPosition the oldPageScroll position and ShowHeader. finalPosition \> oldPageScrol showHeader = false else showHeader = true ---
**Author:** ![HeFur](https://avatars.discourse-cdn.com/v4/letter/h/34f0e0/32.png) [@HeFur](https://community.weweb.io/u/HeFur)\ **Post date:** [July 4, 2025, 1:08pm UTC](https://community.weweb.io/t/translate-based-on-element-scroll-position/19076/6 "2025-07-04T13:08:00Z")
My point is that I don’t have the initial position after the first scroll. For example: 1. I load the page with the var “initialPosition” and “finalPosition” equal to 0. 2. 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) 3. 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. ---
**Author:** ![sam1](https://sea2.discourse-cdn.com/flex016/user_avatar/community.weweb.io/sam1/32/6724_2.png) [@sam1](https://community.weweb.io/u/sam1)\ **Post date:** [July 6, 2025, 2:33am UTC](https://community.weweb.io/t/translate-based-on-element-scroll-position/19076/7 "2025-07-06T02:33:49Z")
Why can’t you Set the initial position in step 2 to the final position so the next time you scroll the initial position is the previous final position ---
**Author:** ![Batik\_Okazov](https://sea2.discourse-cdn.com/flex016/user_avatar/community.weweb.io/batik_okazov/32/12688_2.png) [@Batik\_Okazov](https://community.weweb.io/u/Batik_Okazov)\ **Post date:** [July 6, 2025, 9:13am UTC](https://community.weweb.io/t/translate-based-on-element-scroll-position/19076/8 "2025-07-06T09:13:16Z")
hi there, have you tried this? [![](https://us1.discourse-cdn.com/flex016/uploads/weweb/original/2X/2/2bc72d781944c27da11fa807d4ea43e8c22f51ee.jpeg "Appear transition in WeWeb") ](https://www.youtube.com/watch?v=zMUFbLUH3Xc)