Update homepage.js

Author: benhatsor

homepage/homepage.js

@@ -174,22 +174,35 @@ checkPWA();*/
 
 // add scroll event listeners
 
-const screenHeight = window.innerHeight;
+const screenHeight = window.innerHeight,
+      featurePoints = document.querySelectorAll('#features .ftPoint'),
+      
+      pointMargin = 34,
+      startPointAnimation = (screenHeight / 3) + pointMargin,
+
+
+let totalPointAnimation = startPointAnimation,
+    pointStaggerIntervals = [];
 
-const featurePoints = document.querySelectorAll('#features .ftPoint');
+// set stagger intervals for feature points
+featurePoints.forEach(point => {
 
-const startPointAnimation = screenHeight / 3;
-const pointStaggerInterval = 34 + (7 * 5);
+  totalPointAnimation += point.clientHeight + 34;
 
-function checkScrollAnimations() {
+  pointStaggerIntervals.push(totalPointAnimation);
+  
+});
+
+
+function checkPointAnimations() {
 
   // window scroll position
   const scrolled = window.scrollY || window.pageYOffset;  
-  
-  // add staggered feature points animation
+
+  // check feature point animation
   featurePoints.forEach((point, index) => {
-    
-    const pointAnimation = startPointAnimation + (pointStaggerInterval * index);
+
+    const pointAnimation = pointStaggerIntervals[index];
 
     if (scrolled >= pointAnimation) {
       point.classList.add('visible');
@@ -202,5 +215,5 @@ function checkScrollAnimations() {
 }
 
 
-window.addEventListener('scroll', checkScrollAnimations);
+window.addEventListener('scroll', checkPointAnimations);
 checkScrollAnimations();