인트로 한 번만 작동하게 코드 좀 봐주세요 ㅠㅠ
본문
<section class="intro">
<div class="img_wr"><img src="https://giresvenin2.cafe24.com/web/upload/img/logo.svg"></div>
</section>
<script>
const animationOptions = {
ease: 'expo.inOut'
}
const introAnimation = () => {
const tl = gsap.timeline({
defaults: {
ease: animationOptions.ease,
duration: 1,
}
});
tl.to('.intro__title', {
duration: 1.5,
y: 0,
autoAlpha: 1,
delay: 0.5,
})
.to('.intro__title', {
duration: 1.5,
y: -60,
autoAlpha: 0,
}, '-=0.6')
.to('.intro', {
y: '150%',
duration:3,
}, '-=0.8')
return tl;
}
const skewInElements = elements => {
const tl = gsap.timeline();
tl.from(elements, {
duration: 1,
ease: animationOptions.ease,
skewY: -5,
autoAlpha: 0,
y: 40,
})
return tl;
}
const fadeInElements = elements => {
const tl = gsap.timeline();
tl.from(elements, {
duration: 1,
ease: animationOptions.ease,
y: '50px',
autoAlpha: 0,
stagger: 0.1,
})
return tl;
}
const master = gsap.timeline({
paused: false,
delay: 0.2,
});
master
.add(introAnimation())
</script>
현재 인트로 진입 코드입니다
처음 페이지 진입시에만 이 인트로가 작동하고 서브페이지 갔다가 다시 메인 진입하면 안 나타나게 할 수 있을까요 ???? 고수님들 코드 알려주시면 감사하겠습니다 ㅠㅠ 제 머리론 여기까지가 ...ㅠㅠㅠㅠ