diff --git a/assets/html_files/accordions.html b/assets/html_files/accordions.html
index 8a20b590..0615d872 100644
--- a/assets/html_files/accordions.html
+++ b/assets/html_files/accordions.html
@@ -180,10 +180,12 @@ Simple Accordion
-
-
+
+
+
+
diff --git a/assets/html_files/backgrounds.html b/assets/html_files/backgrounds.html
index ae69bf72..f8082938 100644
--- a/assets/html_files/backgrounds.html
+++ b/assets/html_files/backgrounds.html
@@ -450,10 +450,12 @@ Interactive Balls Background
-
-
+
+
+
+
diff --git a/assets/html_files/breadcrumbs.html b/assets/html_files/breadcrumbs.html
index c7e3d581..2155448d 100644
--- a/assets/html_files/breadcrumbs.html
+++ b/assets/html_files/breadcrumbs.html
@@ -179,11 +179,12 @@ Parallel Park Breadcrumb
-
-
-
+
+
+
+
diff --git a/assets/html_files/buttons.html b/assets/html_files/buttons.html
index ea642c24..ee2bb99f 100644
--- a/assets/html_files/buttons.html
+++ b/assets/html_files/buttons.html
@@ -378,11 +378,12 @@ Swipe Right Button
-
-
-
+
+
+
+
diff --git a/assets/html_files/cards.html b/assets/html_files/cards.html
index 2133f435..1a483b5d 100644
--- a/assets/html_files/cards.html
+++ b/assets/html_files/cards.html
@@ -283,10 +283,12 @@ User Attention Card
-
-
+
+
+
+
🠕
diff --git a/assets/html_files/carousels.html b/assets/html_files/carousels.html
index f70107c4..226a3abc 100644
--- a/assets/html_files/carousels.html
+++ b/assets/html_files/carousels.html
@@ -229,11 +229,12 @@
Card Carousel
-
-
-
+
+
+
+
diff --git a/assets/html_files/dropdowns.html b/assets/html_files/dropdowns.html
index 8509a900..7b262935 100644
--- a/assets/html_files/dropdowns.html
+++ b/assets/html_files/dropdowns.html
@@ -88,10 +88,12 @@ The More Menu Dropdown
-
-
+
+
+
+
diff --git a/assets/html_files/footers.html b/assets/html_files/footers.html
index 3bfd7a40..c0841bd9 100644
--- a/assets/html_files/footers.html
+++ b/assets/html_files/footers.html
@@ -153,10 +153,12 @@ Animated Stylish Footer
-
-
+
+
+
+
diff --git a/assets/html_files/forms.html b/assets/html_files/forms.html
index ea0baa69..087a3e47 100644
--- a/assets/html_files/forms.html
+++ b/assets/html_files/forms.html
@@ -282,10 +282,12 @@ Animated Border Login Form
-
-
+
+
+
+
diff --git a/assets/html_files/loaders.html b/assets/html_files/loaders.html
index a2e6710f..7fe400d7 100644
--- a/assets/html_files/loaders.html
+++ b/assets/html_files/loaders.html
@@ -459,10 +459,12 @@ Polygon Loader
-
-
+
+
+
+
diff --git a/assets/html_files/navigation-bars.html b/assets/html_files/navigation-bars.html
index 7cd445e0..477b731d 100644
--- a/assets/html_files/navigation-bars.html
+++ b/assets/html_files/navigation-bars.html
@@ -231,10 +231,12 @@ Pulse Animated Navigation Bar
-
-
+
+
+
+
diff --git a/assets/html_files/search-bars.html b/assets/html_files/search-bars.html
index 9d9222d6..6d7e1e01 100644
--- a/assets/html_files/search-bars.html
+++ b/assets/html_files/search-bars.html
@@ -229,10 +229,12 @@ Magnifying Glass Search Bar
-
-
+
+
+
+
diff --git a/assets/html_files/text-animations.html b/assets/html_files/text-animations.html
index 714c4a10..4e58f932 100644
--- a/assets/html_files/text-animations.html
+++ b/assets/html_files/text-animations.html
@@ -294,10 +294,12 @@ Shaking Text Animation
-
-
+
+
+
+
diff --git a/assets/html_files/transfer-lists.html b/assets/html_files/transfer-lists.html
index a8fcd504..21132609 100644
--- a/assets/html_files/transfer-lists.html
+++ b/assets/html_files/transfer-lists.html
@@ -88,10 +88,12 @@ Neumorphic Transfer List
-
-
+
+
+
+
diff --git a/assets/js_files/GsapAnimations.js b/assets/js_files/GsapAnimations.js
new file mode 100644
index 00000000..a352bfb4
--- /dev/null
+++ b/assets/js_files/GsapAnimations.js
@@ -0,0 +1,24 @@
+//gsap animations
+
+
+//animation to header part(navbar , logo )
+gsap.from(".navbar", { duration: 1, y: -100, opacity: 0, ease: "power4.out", delay: 1 });
+gsap.from(".logo", { duration: 1, scale: 0, ease: "elastic.out(1, 0.3)", delay: 1 });
+gsap.from(".nav-item", { duration: 0.8, opacity: 0, y: -20, stagger: 0.2, ease: "power2.out", delay: 1.5 });
+
+
+// animation for cards
+gsap.from(".zoom-effect",{
+ scale:0.7,
+ opacity:0,
+ duration:1,
+ stagger:0.2,
+ scrollTrigger:{
+ trigger: ".zoom-effect",
+ scroller:"body",
+ start:"top 70%",
+ end:"top 65%",
+ scrub:2 ,
+ // markers : true,
+ },
+});
diff --git a/assets/js_files/commonanimation.js b/assets/js_files/commonanimation.js
index b0934f92..95d1c6bd 100644
--- a/assets/js_files/commonanimation.js
+++ b/assets/js_files/commonanimation.js
@@ -13,7 +13,29 @@ tl.from(".heading", {
y: 10
});
-tl.from(".contain", {
- opacity: 0,
- y: 10
+
+function triggerAnimation() {
+ gsap.utils.toArray('.box').forEach((box, index) => {
+ const delay = index * 0.2; // Delay for stagger effect
+ gsap.fromTo(box, {
+ opacity: 0, // Start with opacity 0
+ x: index % 2 === 0 ? '-=100' : '+=100' // Move from left or right based on index
+ }, {
+ opacity: 1,
+ x: 0,
+ delay,
+ duration: 0.8, // Duration of the animation
+ ease: 'power2.out' // Easing function
+ });
+ });
+}
+
+// ScrollTrigger to trigger the animation when in the viewport
+gsap.registerPlugin(ScrollTrigger);
+ScrollTrigger.create({
+ trigger: '.contain', // Trigger animation when the container is in the viewport
+ start: "top center", // Start the animation when the container reaches the center of the viewport
+ onEnter: triggerAnimation // Call the function to trigger animation
});
+
+
diff --git a/index.html b/index.html
index 7c53d1ac..c9ae9db2 100644
--- a/index.html
+++ b/index.html
@@ -269,7 +269,10 @@ Transfer Lists
🠕
-
+
+
+
+