1 files changed, 61 insertions, 0 deletions
diff --git a/js/parallax.js b/js/parallax.js
new file mode 100644
index 0000000..9c2c671
--- /dev/null
+++ b/js/parallax.js
@@ -0,0 +1,61 @@
+// Parallax scroll effects for Nixtaml website
+// Vanilla JavaScript implementation with performance optimizations
+
+(function() {
+    // Check for reduced motion preference
+    const prefersReducedMotion = window.matchMedia('(prefers-reduced-motion: reduce)').matches;
+
+    // Check if mobile (disable parallax for better performance)
+    const isMobile = window.innerWidth < 768;
+
+    // If reduced motion or mobile, exit early
+    if (prefersReducedMotion || isMobile) {
+        return;
+    }
+
+    // Throttle function for scroll events
+    function throttle(func, limit) {
+        let inThrottle;
+        return function() {
+            const args = arguments;
+            const context = this;
+            if (!inThrottle) {
+                func.apply(context, args);
+                inThrottle = true;
+                setTimeout(() => inThrottle = false, limit);
+            }
+        }
+    }
+
+    // Parallax animation function
+    let ticking = false;
+    function updateParallax() {
+        if (!ticking) {
+            requestAnimationFrame(function() {
+                const scrolled = window.pageYOffset;
+
+                // Get all elements with data-speed
+                const parallaxElements = document.querySelectorAll('[data-speed]');
+
+                parallaxElements.forEach(element => {
+                    const speed = parseFloat(element.getAttribute('data-speed')) || 0;
+                    const yPos = -(scrolled * speed);
+                    element.style.transform = `translateY(${yPos}px)`;
+                });
+
+                ticking = false;
+            });
+            ticking = true;
+        }
+    }
+
+    // Throttled scroll handler
+    const throttledUpdate = throttle(updateParallax, 16); // ~60fps
+
+    // Add scroll listener
+    window.addEventListener('scroll', throttledUpdate, { passive: true });
+
+    // Initial call
+    updateParallax();
+})();</content>
+<parameter name="filePath">js/parallax.js
+\ No newline at end of file