-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.js
68 lines (59 loc) · 1.24 KB
/
index.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
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
function navbar(){
let menu=document.querySelector("#menu");
let navpart2=document.querySelector("#navpart2");
let cross=document.querySelector("#cross");
let lava=document.querySelector("nav");
let tl=gsap.timeline();
tl.from(navpart2,{
x:150,
duration:1,
stagger:0.2,
})
tl.pause();
gsap.from(lava,{
y:-100,
duration:2,
})
menu.addEventListener("click",function(){
navpart2.style.opacity="1";
menu.style.display="none";
cross.style.display="block";
cross.style.position="absolute";
cross.style.right="-16%";
tl.play();
})
cross.addEventListener("click",function(){
menu.style.display="block";
cross.style.display="none";
tl.reverse();
})
}
navbar();
function page1(){
let myh1=document.querySelector("#myh1");
let myh2=document.querySelector("#myh2");
let para=document.querySelector("#page1 p");
let btn=document.querySelector("#buttons");
gsap.from(myh1,{
opacity:0,
duration:2,
scale:1.2,
})
gsap.from(myh2,{
opacity:0,
duration:2,
scale:1.2,
})
gsap.from(para,{
duration:2,
x:-100,
opacity:0,
})
gsap.from(btn,{
opacity:0,
duration:2,
scale:1.2,
x:100,
})
}
page1();