Implement GSAP Features in 'neler-yapariz-gsap' Template: Introduced a comprehensive set of GSAP animations and sections in the 'neler-yapariz-gsap' template, enhancing the visual dynamics of the page. This update includes new JavaScript and CSS files for various animations, such as flip, inertia, marquee, and scrolltrigger, along with a structured layout for improved user interaction. Additionally, localization support has been integrated for all text elements, ensuring a seamless experience for users across different languages.

2026-01-10 17:47:51 +03:00
parent 3ad69677d8
commit 2fdf187658
42 changed files with 1902 additions and 78 deletions
@@ -0,0 +1,44 @@
+{
+  const params = {
+    duration: 0.8,
+    ease: "expo.out",
+  };
+
+  const handleSecondaryVisibility = (secondary) => {
+    const observer = new IntersectionObserver(
+      (entries) => {
+        entries.forEach((entry) => {
+          if (entry.isIntersecting) {
+            gsap.to(secondary, {
+              yPercent: 200,
+              ...params,
+            });
+          } else {
+            gsap.to(secondary, {
+              yPercent: 0,
+              ...params,
+            });
+          }
+        });
+      },
+      {
+        threshold: 0.02,
+        rootMargin: "-10% 0px",
+      }
+    );
+
+    const contentElement = document.getElementById("content");
+    if (contentElement) {
+      observer.observe(contentElement);
+    }
+  };
+
+  addEventListener("GSAPReady", (event) => {
+    const wrapper = document.querySelector("[data-module='nav']");
+    if (!wrapper) return;
+    const main = wrapper.children[0];
+    const secondary = wrapper.children[1].children[0];
+
+    handleSecondaryVisibility(secondary);
+  });
+}