Streaming live at 10am (PST)

Show 'current' anchor link, hide remaining

Hi,

I am looking for a way to achieve this subtle interaction:
Lineto.com
(it’s that title that changes according to its corresponding section, in the upper left corner)

… I have only made it this far though. I really hope I can solve it by using Webflow native interactions only, but of course any help is welcome.

Here is my public share link:
https://preview.webflow.com/preview/jacob-darfelts-marvelous-site?utm_medium=preview_link&utm_source=designer&utm_content=jacob-darfelts-marvelous-site&preview=72085507c3ab470b6660e47aa49868ec&workflow=preview

Thanks in advance
Jacob

I’m probably not the best to answer this --but i can tell you this is a difficult problem with native webflow. Similar topic here.
Perhaps, it’s just a simple as making your section labels position:fixed at the top of a section and then fading them away at the end of the section end. Not sure.
Last thought🤔 if you set a fixed height to your page and can control the height of all your Sections, then you can use percentages on the IX scroll into view method to control which Section label shows and disappears upon scroll.

1 Like

Thanks Whit! I read through that similar topic now and I see how it’s causing problems for others as well. I will try to create what you described in your last suggestion, as I probably will be able to control the height of all sections (as in, they will all be 100vh). I assume I will then have to ‘stack’ the section labels somehow and then use the sections themselves as triggers for hide and reveal, right?

Whit’s suggestion is a good starting point. You’re essentially going to need to do 2 things here:

  1. Only show the current anchor link. This seems doable if you hide all of the anchor links by default and then set up an interaction trigger based on whether that anchor element is in view or not.

  2. Position anchor links in the top left. As Whit suggested you should be able to do this with position set to absolute top-left.

Looking forward to seeing the final result!

1 Like

Thanks! Sarwech. Much appreciated!
I was about to do something more complicated, but i will try with you 2 steps later today.

1 Like

Hmmm, I don’t understand the absolute position though? Now, that I want the ‘titles’ to appear fixed to the browser – as in the inspiration i linked to in my first post – why the absolute position?

Also, would it be possible to target a class and the re-use that interaction, instead of targeting the single element (the anchor link) one by one?

Anyway, this is as far as i am right now – and a bit stuck…
https://preview.webflow.com/preview/jacob-darfelts-marvelous-site?utm_medium=preview_link&utm_source=designer&utm_content=jacob-darfelts-marvelous-site&preview=72085507c3ab470b6660e47aa49868ec&workflow=preview

This topic was automatically closed 24 hours after the last reply. New replies are no longer allowed.