Fade Out First Index Page

ezgif-3-5352e39e5c44.gif

Step One

From your Squarespace account, go to Code Injection: Settings > Advanced > Code Injection

Step Two

Copy and paste the code below into the Footer Code Injection box.

<script>  
  var sectionName = document.querySelector(".Index-page:first-child");
  function getHeight() {
    return sectionName.clientHeight;
  }
  var gotHeight = getHeight();
  window.onscroll = function() {
    sectionName.style.opacity = 1 - (window.pageYOffset / (gotHeight - 125));
  };
</script>

Step Three

You do not need to change any of the values or properties.

Please keep in mind that this targets only the first page within an index. It does not target general pages or banners.

Save and refresh the page. 👍

Moov Labs