Horizontal Scroll

The number of scroll_nav links needs to match the number of scroll_anchor and scroll_item elements. Each scroll_anchor needs to have their own ID and the scroll_nav links will anchor link to the relevant id.

Once you have added all the items, change the width of the scroll_horizontal to [number of items]*100vw, alternatively you can add this code to automatically change the scroll_horizontal width to match the number of items.

<script>
// Get the number of .scroll_item elements inside .scroll_horizontal-cms
var itemCount = $('.scroll_horizontal .scroll_item').length;

// Calculate the width
var width = itemCount * 100 + 'vw';

// Assign the calculated width to .scroll_horizontal
$('.scroll_horizontal').css('width', width);
</script>

If you would like a more scalable solution check out the one based on the CMS.

If you are using the static version I suggest creating a component to easily edit the sections that are off screen.