-
Notifications
You must be signed in to change notification settings - Fork 2
/
app.js
46 lines (39 loc) · 865 Bytes
/
app.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
document.addEventListener('DOMContentLoaded', () => {
gsap.to('.dots1', {
yPercent: 60,
scrollTrigger: {
scrub: 0.3
}
})
gsap.to('.dots2', {
xPercent: 100,
scrollTrigger: {
scrub: 0.3
}
})
let tl = gsap.timeline({
scrollTrigger: {
trigger: '.bg',
pin: true,
start: 'top top',
end: '+=' + window.innerHeight * 2,
scrub: 0.3,
}
})
tl.to('.bg', {
rotation: -360,
xPercent: -100,
yPercent: 25,
backgroundColor: 'transparent',
backgroundSize: '100%',
clipPath: 'circle(50% at 50% 50%)',
})
tl.to('.bg', {
yPercent: 10
})
tl.to('.bg', {
yPercent: 0,
xPercent: -10,
rotation: '+=10',
})
})