import React, { useEffect, useRef, useState } from "react";
import { motion } from "framer-motion";
import mypic from "../public/images/Untitled-transformed.jpeg";
import video from "../public/Videos/workportfilio.mp4";
import { useGSAP } from "@gsap/react";
import gsap from "gsap";
import { ScrollTrigger } from 'gsap/ScrollTrigger';
const Home = () => {
const aboutsectiontextanimtion = useRef();
const parentofaboutsectiontextanimtion = useRef()
useEffect(() => {
if (aboutsectiontextanimtion.current && parentofaboutsectiontextanimtion.current) {
gsap.to(aboutsectiontextanimtion.current, {
x: '30vw',
scrollTrigger: {
trigger: aboutsectiontextanimtion.current,
scroller: parentofaboutsectiontextanimtion.current,
scrub: 1,
start: "top middle",
end: "+=90",
markers: true,
pin: true,
}
});
}
}, []);
return (
<div ref={parentofaboutsectiontextanimtion} className="bg-blue-500 h-[140vh] rounded-lg w-full">
<div ref={aboutsectiontextanimtion} className="text-7xl">acavasvasv</div>
</div>
</div>
)
i reinstall all require node pacakges but it still not owrking