[Multiple sections with smooth scrolling that "glides" to a stop]

Thanks, Zach. I'm using the class in the code, not the id. I know id's have to be unique. I'm not a complete idiot, just when it comes to js

 

I'll have to try the .getBoundingClientRect().top. 

 

Thank you.

[Multiple sections with smooth scrolling that "glides" to a stop]

Hi Zach, 

Thank you for replying. I changed it to querySelectorAll, so it is indeed firing for both now. But, it's using the first instance of ".scroll-container" instead of the second. You can see the codepen here 

See the Pen BayjPjZ by rbkhrlstn (@rbkhrlstn) on CodePen

.

 

I don't know if there is another way to go about it?

[Multiple sections with smooth scrolling that "glides" to a stop]

In several questions about smooth scrolling, there is a link to this project on codepen (). It is amazing and awesome and just what I had spent weeks looking for. I, however, am new to javascript and would like to be able to have more than one scroll-container on the page. It would be a scroll-container, a normal section, and then another scroll container. I imagine I need to do a loop or reset, but I don't know how to do it correctly. It would be "for each .scroll-container, do the magic."

 

Here is the site I'm trying to do this on (http://detroitdough.flywheelstaging.com/). It would be the two sections with the "dough" in them. I have the first one working but can't figure out how to loop the second one in.

See the Pen QqPqbN by osublake (@osublake) on CodePen