add random duration

christmas.js

@@ -1,6 +1,7 @@
 const christmas = true; // enable/disable christmas
 const randomChristmas = true; // enable random Christmas
 const randomChristmasMobile = false; // enable random Christmas on mobile devices
+const enableDiffrentDuration = true; // enable different duration for the random Christmas symbols
 const christmasCount = 25; // count of random extra christmas
 
 
@@ -61,13 +62,20 @@ function addRandomChristmas(count) {
 
     // set random horizontal position, animation delay and size(uncomment lines to enable) 
     const randomLeft = Math.random() * 100; // position (0% to 100%)
-    const randomAnimationDelay = Math.random() * 8; // delay (0s to 8s)
+    const randomAnimationDelay = Math.random() * 12 + 8; // delay (8s to 12s)
-    const randomAnimationDelay2 = Math.random() * 5; // delay (0s to 5s)
+    const randomAnimationDelay2 = Math.random() * 5 + 3; // delay (0s to 5s)
 
     // apply styles
     christmasDiv.style.left = `${randomLeft}%`;
     christmasDiv.style.animationDelay = `${randomAnimationDelay}s, ${randomAnimationDelay2}s`;
 
+    // set random animation duration
+    if (enableDiffrentDuration) {
+      const randomAnimationDuration = Math.random() * 10 + 6; // delay (6s to 10s)
+      const randomAnimationDuration2 = Math.random() * 5 + 2; // delay (2s to 5s)
+      christmasDiv.style.animationDuration = `${randomAnimationDuration}s, ${randomAnimationDuration2}s`;
+    }
+
     // add the christmas to the container
     christmasContainer.appendChild(christmasDiv);
   }
@@ -90,6 +98,13 @@ function initChristmas() {
     christmasDiv.className = 'christmas';
     christmasDiv.textContent = christmasSymbols[Math.floor(Math.random() * christmasSymbols.length)];
 
+    // set random animation duration
+    if (enableDiffrentDuration) {
+      const randomAnimationDuration = Math.random() * 10 + 6; // delay (6s to 10s)
+      const randomAnimationDuration2 = Math.random() * 5 + 2; // delay (2s to 5s)
+      christmasDiv.style.animationDuration = `${randomAnimationDuration}s, ${randomAnimationDuration2}s`;
+    }
+
     christmasContainer.appendChild(christmasDiv);
   }
 }