CSS Only Scroll Indicator: youmightnotneedjs.com

            
              <header class="scroller"></header>
<main>
  <h1>Content Must Be Longer Than The Viewport Height or This Makes No Sense.</h1>
	<div>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Consectetur dolorum a natus, praesentium nesciunt recusandae excepturi qui debitis optio enim eligendi iusto quos animi. Soluta neque ad eos itaque debitis.</div>
	<div>Quidem minus deserunt reiciendis temporibus quisquam! Eaque illum eligendi, perspiciatis ea animi pariatur dolores necessitatibus aliquam quos esse autem rerum possimus culpa neque sit sapiente accusantium odio! Dicta, facilis, earum.</div>
	<div>Sequi, doloribus tempora sit odit dolorum, aliquam inventore. Qui libero ea iure velit iste impedit, corrupti est. Recusandae, est inventore explicabo quis accusamus ipsam repellendus nostrum soluta ad. Enim, voluptatem.</div>
	<div>Eum beatae placeat voluptate. Iste pariatur aspernatur expedita voluptates, eius exercitationem nisi ratione sapiente sunt sint quo nihil sit repellendus veniam provident ea debitis atque similique iure vitae fugiat. Pariatur!</div>
	<div>Dolores sunt voluptatibus qui maxime distinctio, repellendus iure animi assumenda, perferendis minima amet doloribus odit recusandae, magnam doloremque dolorum quae quas expedita ab laborum rerum mollitia. Commodi voluptatum, deleniti fugiat.</div>
	<div>Minima voluptate ut facere officiis, perferendis rem beatae et tempore aperiam debitis, vel sequi asperiores placeat repellendus fuga? Dolorem, maxime eveniet, inventore excepturi fugit molestias sed minus natus placeat numquam?</div>
	<div>Quam dignissimos saepe vero omnis quidem, voluptatum nisi consequatur fugiat, veniam quo, ea. Fuga ut ducimus, libero doloremque corporis labore voluptas nulla modi qui voluptate, alias fugit dignissimos quibusdam odit!</div>
	<div>Nisi totam nesciunt error magnam fugit enim possimus earum commodi! Nesciunt provident deserunt totam officiis cumque consequatur ex dolorem! Accusantium mollitia laboriosam beatae perferendis ab quibusdam dolor veniam nobis amet.</div>
	<div>Voluptatem voluptates officiis fuga, dolore eveniet ab praesentium doloremque numquam cum magni sapiente quaerat ea voluptatum quae explicabo similique cumque veniam id blanditiis velit itaque quidem temporibus. Illo, consequatur, doloremque.</div>
	<div>Nam, omnis. Sit, dolore quia, sunt consequatur commodi alias quo repudiandae ab, rem accusantium, in molestiae. Voluptate possimus quas fugiat totam esse dignissimos! Odit quasi accusamus, iure laudantium id corporis?</div>
  <div>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Consectetur dolorum a natus, praesentium nesciunt recusandae excepturi qui debitis optio enim eligendi iusto quos animi. Soluta neque ad eos itaque debitis.</div>
	<div>Quidem minus deserunt reiciendis temporibus quisquam! Eaque illum eligendi, perspiciatis ea animi pariatur dolores necessitatibus aliquam quos esse autem rerum possimus culpa neque sit sapiente accusantium odio! Dicta, facilis, earum.</div>
	<div>Sequi, doloribus tempora sit odit dolorum, aliquam inventore. Qui libero ea iure velit iste impedit, corrupti est. Recusandae, est inventore explicabo quis accusamus ipsam repellendus nostrum soluta ad. Enim, voluptatem.</div>
	<div>Eum beatae placeat voluptate. Iste pariatur aspernatur expedita voluptates, eius exercitationem nisi ratione sapiente sunt sint quo nihil sit repellendus veniam provident ea debitis atque similique iure vitae fugiat. Pariatur!</div>
	<div>Dolores sunt voluptatibus qui maxime distinctio, repellendus iure animi assumenda, perferendis minima amet doloribus odit recusandae, magnam doloremque dolorum quae quas expedita ab laborum rerum mollitia. Commodi voluptatum, deleniti fugiat.</div>
	<div>Minima voluptate ut facere officiis, perferendis rem beatae et tempore aperiam debitis, vel sequi asperiores placeat repellendus fuga? Dolorem, maxime eveniet, inventore excepturi fugit molestias sed minus natus placeat numquam?</div>
	<div>Quam dignissimos saepe vero omnis quidem, voluptatum nisi consequatur fugiat, veniam quo, ea. Fuga ut ducimus, libero doloremque corporis labore voluptas nulla modi qui voluptate, alias fugit dignissimos quibusdam odit!</div>
	<div>Nisi totam nesciunt error magnam fugit enim possimus earum commodi! Nesciunt provident deserunt totam officiis cumque consequatur ex dolorem! Accusantium mollitia laboriosam beatae perferendis ab quibusdam dolor veniam nobis amet.</div>
	<div>Voluptatem voluptates officiis fuga, dolore eveniet ab praesentium doloremque numquam cum magni sapiente quaerat ea voluptatum quae explicabo similique cumque veniam id blanditiis velit itaque quidem temporibus. Illo, consequatur, doloremque.</div>
	<div>Nam, omnis. Sit, dolore quia, sunt consequatur commodi alias quo repudiandae ab, rem accusantium, in molestiae. Voluptate possimus quas fugiat totam esse dignissimos! Odit quasi accusamus, iure laudantium id corporis?</div>
</main>