Scroll navigation

Demo

Content 1

Content 2

Content 3

Content 4

Code

<ul class="c-scroll-navigation" id="scroll-navigation">
	<li><button>Content 1</button></li>
	<li><button>Content 2</button></li>
	<li><button>Content 3</button></li>
	<li><button>Content 4</button></li>
</ul>
<div class="c-scroll-navigation-content" data-scroll-navigation-content>
	<div>
		<p>Content 1</p>
	</div>
	<div>
		<p>Content 2</p>
	</div>
	<div>
		<p>Content 3</p>
	</div>
	<div>
		<p>Content 4</p>
	</div>
</div>
new ScrollNavigation(document.querySelector("#scroll-navigation"));