test inteception left and right

resources/js/app.js

@@ -55,12 +55,12 @@ const countdownTimer = setInterval(() => {
 $(function() {
     var partLeftPos = 0;
     var partRightPos = 0;
-    
-    $(window).scroll(function(event) {
-        var distance = $(this).scrollTop() * 2;
+
+    function updatePositions() {
+        var distance = $(window).scrollTop() * 2;
         var left = partLeftPos - distance;
         var right = partRightPos - distance;
-        
+
         $('.left').css('left', left + "px");
         $('.right').css('right', right + "px");
 
@@ -72,19 +72,29 @@ $(function() {
 
         // Toggle visibility and z-index
         if (isLeftOffScreen && left < 0) {
-            $('.left').css('left', 0 + "px");
-            $('.right').css('right', 0 + "px");
-            $('.parent').removeClass(['z-30']);
+            $('.parent').removeClass('z-30');
         } else {
-            
-            $('.parent').addClass(['z-30']);
+            $('.parent').addClass('z-30');
+        }
+    }
+
+    // Initial positions update
+    updatePositions();
+
+    // Listen to scroll events using requestAnimationFrame for smooth animation
+    var ticking = false;
+    $(window).scroll(function() {
+        if (!ticking) {
+            window.requestAnimationFrame(function() {
+                updatePositions();
+                ticking = false;
+            });
         }
+        ticking = true;
     });
-    
-    // Initially check visibility on page load
-    $(window).trigger('scroll');
 });
 
+
 document.addEventListener('click', function () {
     setTimeout(function () {
         document.getElementById('petalOverlay').style.display = 'block';