CUDO Communication

import React, { useEffect, useState } from 'react'; import { motion } from 'framer-motion'; import styled from 'styled-components'; const images = [ 'https://cdn.imweb.me/thumbnail/20250418/fb765b0e6231a.png', 'https://images.unsplash.com/photo-1506744038136-46273834b3fb', 'https://images.unsplash.com/photo-1465101046530-73398c7f28ca', ]; const Wrapper = styled.div` width: 100%; height: 100vh; position: relative; overflow: hidden; `; const StyledImage = styled(motion.img)` position: absolute; width: 100%; height: 100%; object-fit: cover; top: 0; left: 0; `; const directions = [ { x: -400, y: -200 }, // 왼쪽 위 { x: 400, y: -200 }, // 오른쪽 위 { x: 0, y: 400 }, // 아래 ]; const HeroImages = () => { const [scattered, setScattered] = useState(false); useEffect(() => { const handleScroll = () => { if (window.scrollY > 50) setScattered(true); else setScattered(false); }; window.addEventListener('scroll', handleScroll); return () => window.removeEventListener('scroll', handleScroll); }, []); return ( {images.map((src, idx) => (