Snap Scrolling CSS

I am currently building a page which uses the relatively new CSS feature: snap scroll. I have defined a container for my sections and set "scroll-snap-type: y mandatory" and for each section a "scroll-snap-align: start". I've tested this in an isolated example (ie an editor in my system) and it works but does not work in squarespace. Is this feature not supported yet?

Hi @ppsu, Please do share the code so I can look in to it and assist you futher with it 🙂 

Hey guys. This worked perfectly!

Put this on Header.

Settings -> Advanced -> Code injection (Header)

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/scrollify/1.0.19/jquery.scrollify.min.js"></script>
<script>
        $(function() {
          $.scrollify({
            section : ".Index-page",
          });
        });
</script> 

In case you just want one index page to have the snap effect just put this on the INDEX page ADVANCED (header).

do you know if this will work for snapping to section id's?

On 5/16/2021 at 12:00 AM, tpassow said:

do you know if this will work for snapping to section id's?

Try replace

Quote

.Index-page

with

Quote

.page-section

Does anyone know why this isnt working with my markdown? as soon as i add in an accordion menu, the snap-scroll no longer works.

im following this method 

https://stnsvn.com/blog/how-to-add-an-accordion-to-squarespace