How to do the animated scroll effect automatically?

0

This site that I found link has a super cool effect that I would like to make a similar on my site:  

When you scroll down, item 01 changes to 02. Consequently, the content changes.

I know I should use Javascript and CSS, but I can not find some tutorial explaining how it works.

Has anyone done or has anything like this?

    
asked by anonymous 30.11.2016 / 13:11

1 answer

1

The side menu with the items is fixed by CSS: position: fixed and the height of the line that indicates which item is currently appearing is modified with each scroll of the page. Just as the function of clicking on the items and animating the page also depends on scroll.

One way to do this effect is: $('html, body').animate({scrollTop: $('#id').offset().top}, 'slow');

Take a look at these functions link and (offset takes the coordinates of the chosen element)

Example found on Jsfiddle: link

    
30.11.2016 / 13:40