Date Vertical Scroll

I want to do a vertical scroll area, very similar to the date scroll shown on the right in the Forum Topic. Eventually I’d like to hook it up to CMS for a project, and show the various parts of the project as the user scrolls vertically through the parts of the project that they have completed or will complete, having the name appear on the scoll bar then fade out as you scroll past. And optimally I’d like to show completed parts in the scrollbar with green, and partially completed as yellow, and uncompleted as orange, sort of like Excel can show entries in different colors based on specific criteria.

Which of the above can I do directly in webflow? Where do I find how to do them? I see horizontal scroll tutorials, and vertical parallax tutorials, and interaction tutorials. And I see (legacy) items. Please provide guidance on the best way to do this at this time as a new website.

Pam


Here is my site Read-Only: LINK
(how to share your site Read-Only link)

Well hey don’t shoot for the stars or anything, huh? :wink:

Just teasing, because there’s a lot in here. Honestly, there really isn’t a way anyone can explain how to do what you’re trying to create, primarily because of functionality. Webflow is a powerful application with numerous ways to accomplish the same goal. To give others a solid place to start offering help, my suggestion is to search structure first:

  1. Go through the Webflow Designers page: https://webflow.com/discover/popular#recent
    Look for similar sites using your desired “Layout”, don’t pay too much attention to functionality or animations. Layout structure is the key to a smooth, fluid Webflow site.

  2. Visit Lapa’s collection for the same: https://www.lapa.ninja/
    This site is full of top notch development, and loaded with current and progressive styles. I like this site because they only show developers who push the envelope, and it’s updated constantly.

  3. After you find a couple of layout designs you like, then members in the community can provide advice on how to move elements within the confined space - or structure you create. Advising on interactions should be last.

Hope this helps a little.
G.J.

1 Like

Hi @pampierce

Something along similar lines here by @Aaron

https://webflow.com/blog/build-a-page-progress-bar

2 Likes

Thanks! This is an excellent beginning to my problem!
Pam

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