How to do a smooth scroll anchor side bar as Webflow website?

Design help General
1

Hi,

How to create this scroll sidebar?

Features that would like to archive in the example:

  • Click and highlighted sidebar items
  • The little arrow follows the currently selected section
  • Smooth scrolling to the anchor

Thanks.

Anthony

2

Hi,

You can use an element with a sticky or fixed position. In that element, you can drag a selection of buttons or links which you can assign to sections.

You should familiarise yourself with section and anchor points before you do this.

To achieve the arrows, you would need to configure the buttons so that when they’re active, the arrow is displayed. This will achieve the arrow effect you’re looking for.

Smooth scrolling to the anchor is automatic.

I hope this helps. But this is quite an involved process - so watching videos like this one might help.

3

Thanks a lot. That’s helpful.

1 Like