I've got an arrow hovering over my page. I need it to move from left to right depending on how far the user has scrolled down the page. It's to form a sort of 'progress indicator'. So at the top of the page the arrow is sitting on the left edge of the page. When you scroll to the bottom of the page the arrow should be sitting on the right edge of the page. I've set triggers as you scroll down the page that continually reposition the arrow.
The problem I have is making it responsive. If I bump the arrow across based on Pixels it will of course not work on multiple devices. I've tried using the % option - but it's very similar to the Pixel option. Is there some way of setting it's position to a percentage width of the page? This way regardless of the device - if it's 66% through scrolling down the page then it can set 66% across the page etc?
Hopefully that makes sense
I'm going to go to bed and tackle it further in the morning
PS - I didn't have to necessarily be a triangle moving left and right. But I do need something denoting the progress of scrolling throughout the length of the page. If anyone has any better ideas I'm open to them
PPS - I can't share the link to the page because unfortunately some of the content is confidential at this point - sorry