Scroll to top

scroll-to-top.html

<main class="main post" id="anchor" role="main">
  Content...
</main>

<a id="topBtn" class="btn-fixed" href="#anchor">
    Lleva a la parte superior de la página.
</a>

<script>
  // When the user scrolls down 500px from the top of the document, show the button
  window.addEventListener('scroll', function () {
      if (document.body.scrollTop > 500 || document.documentElement.scrollTop > 500) {
          document.getElementById('topBtn').style.display = 'block';
      } else {
          document.getElementById('topBtn').style.display = 'none';
      }
  });
</script>
  
<style>
	  html {
      	/* This adds the smooth scroll */
    	  scroll-behavior: smooth;
	  }

  	.btn-fixed {
		    background-color: #0045C2;
      	bottom: 1rem;
      	color: white;
      	display: none;
      	max-width: 10rem;
      	position: fixed;
      	right: 1rem;
      	text-align: center;
   }
</style>