Scroll snapping to sections

General Help
1

Within a Page you have multiple Article sections which the user can scroll the page to read.

Is there a way to adding scroll snapping? so if they scroll close to the section it will snap the top to match the browser window? I don’t see anything in the options.

element_snap_positions_offset
element_snap_positions_offset286×1118 6.82 KB

You can view an example of this effect here:

This is easy to achieve by adding css:

.page .page-inner {
  height: 100vh;
  scroll-snap-type: y proximity;
  overflow-y: scroll;
}
.article,
.content {
  scroll-snap-align: start;
}

But custom css is not allowed within Evolve. How else could this be achieved?

1 Like
2

I would love to know if this could happen too. I assume that no answer by the support team means this isnt capable?

3

Since Evolve courses support IE11/Edge browsers, it won’t be possible to simply add the suggested CSS. We would need to add a javascript solution for the unsupported browsers listed here which would take some time. https://caniuse.com/#search=scroll-snap-align