refector code and kill all scrollTrigger

This commit is contained in:
T-A-H-prog
2026-04-03 21:02:48 +02:00
parent 5b3ac4fb89
commit a4cff85c10
3 changed files with 227 additions and 206 deletions

View File

@@ -1,45 +1,37 @@
<script setup lang="ts">
import HeroSection from '../components/sections/HeroSection.vue'
import ImageSection from '../components/sections/ImageSection.vue'
import TextSection from '../components/sections/TextSection.vue'
import HeroSection from "../components/sections/HeroSection.vue";
import ImageSection from "../components/sections/ImageSection.vue";
import TextSection from "../components/sections/TextSection.vue";
import { onMounted, nextTick } from "vue"
import gsap from "gsap"
import ScrollTrigger from "gsap/ScrollTrigger"
import ScrollSmoother from "gsap/ScrollSmoother"
import { onMounted, nextTick } from "vue";
import gsap from "gsap";
import ScrollTrigger from "gsap/ScrollTrigger";
import ScrollSmoother from "gsap/ScrollSmoother";
gsap.registerPlugin(ScrollTrigger, ScrollSmoother)
gsap.registerPlugin(ScrollTrigger, ScrollSmoother);
onMounted(async () => {
await nextTick()
await nextTick();
ScrollSmoother.create({
wrapper: "#smooth-wrapper",
content: "#smooth-content",
smooth: 0.2,
effects: true
})
ScrollTrigger.refresh()
})
effects: true,
});
ScrollTrigger.refresh();
});
</script>
<template>
<div id="smooth-wrapper">
<div id="smooth-wrapper">
<div id="smooth-content">
<HeroSection id="hero" />
<ImageSection id="image" />
<TextSection id="text" />
</div>
<HeroSection id="hero" />
<ImageSection id="image" />
<TextSection id="text" />
</div>
</div>
</template>
<style lang="css" scoped>
</style>
<style lang="css" scoped></style>