From c9602c13bd09957ad56b54ef2966bc6f5e27082d Mon Sep 17 00:00:00 2001
From: Maximilian Leo Huber <maximilian.huber@uni-bielefeld.de>
Date: Wed, 11 Sep 2024 12:23:13 +0000
Subject: [PATCH] Testing different start trigger
---
src/contents/Home.tsx | 40 +++++++++++++++++++++-------------------
1 file changed, 21 insertions(+), 19 deletions(-)
diff --git a/src/contents/Home.tsx b/src/contents/Home.tsx
index 25c06619..417738ab 100644
--- a/src/contents/Home.tsx
+++ b/src/contents/Home.tsx
@@ -54,7 +54,7 @@ export function Home() {
const main = gsap.timeline({
scrollTrigger: {
- trigger: "svg",
+ trigger: "animStarterClass",
scrub: true,
start:"top middle",
end: "bottom middle"
@@ -74,24 +74,26 @@ export function Home() {
return (
<>
- <div className="row col">
- <H2 text="iGEM Bielefeld-CeBiTec 2024"/>
- </div>
- <div className="row col">
- <svg id="svg" viewBox="0 0 2000 2500">
- <path className="homeAnimLine" d="
- M 50 50
- C 500 -50 1000 100 1870 50
- C 1820 220 2024 528 1870 590
- C 1351 678 118 451 54 561
- C 3 672 12 985 55 985
- C 586 1090 1342 898 1881 1038
- C 1994 1194 1986 1568 1890 1681
- C 1751 1803 281 1481 168 1646
- C 81 1794 21 1977 168 2142
- C 499 2246 1403 2325 1081 2142"/>
- </svg>
- <img className="vector" ref={vectorRef} src={"https://static.igem.wiki/teams/5247/placeholders/vector.webp"} alt="vectorImg"/>
+ <div className="animStarterClass">
+ <div className="row col">
+ <H2 text="iGEM Bielefeld-CeBiTec 2024"/>
+ </div>
+ <div className="row col">
+ <svg id="svg" viewBox="0 0 2000 2500">
+ <path className="homeAnimLine" d="
+ M 50 50
+ C 500 -50 1000 100 1870 50
+ C 1820 220 2024 528 1870 590
+ C 1351 678 118 451 54 561
+ C 3 672 12 985 55 985
+ C 586 1090 1342 898 1881 1038
+ C 1994 1194 1986 1568 1890 1681
+ C 1751 1803 281 1481 168 1646
+ C 81 1794 21 1977 168 2142
+ C 499 2246 1403 2325 1081 2142"/>
+ </svg>
+ <img className="vector" ref={vectorRef} src={"https://static.igem.wiki/teams/5247/placeholders/vector.webp"} alt="vectorImg"/>
+ </div>
</div>
</>
);
--
GitLab