MotionMuse/script.js at main · Yatharth-coding/MotionMuse · GitHub

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
69
70
71
72
73
74
75
76
77
78
79
80
81
82
// first use locomotive js for the smmoth scrolling
const scroll = new LocomotiveScroll({
    el: document.querySelector("#main"),
    smooth: true
});

// gsap to animate
gsap.from(".navlink",{
    opacity:0,
    y:20,
    stagger:.3,
    duration:1.5,
    ease:Power1,
})

gsap.from(".anime2" , {
    y:30,
    stagger :.2,
    opacity:0,
    ease:Expo,
    delay:1,
    duration:1
})


// shery js to animate images accordingly
Shery.textAnimate("#heading h1" , {
  //Parameters are optional.
  style: 1,
  y: 10,
  delay: .2,
//   duration: 0.1,
  ease: "cubic-bezier(0.23, 1, 0.320, 1)",
  multiplier: 0.1,
});

Shery.imageEffect("#imageandtext img",{
    style:3 ,
    config:{"uFrequencyX":{"value":6.11,"range":[0,100]},"uFrequencyY":{"value":10.69,"range":[0,100]},"uFrequencyZ":{"value":25.95,"range":[0,100]},"geoVertex":{"range":[1,64],"value":14.47},"zindex":{"value":-9996999,"range":[-9999999,9999999]},"aspect":{"value":0.75},"ignoreShapeAspect":{"value":true},"shapePosition":{"value":{"x":-0.02,"y":0.02}},"shapeScale":{"value":{"x":0.52,"y":0.55}},"shapeEdgeSoftness":{"value":0.36,"range":[0,0.5]},"shapeRadius":{"value":0,"range":[0,2]},"currentScroll":{"value":0},"scrollLerp":{"value":0.07},"gooey":{"value":false},"infiniteGooey":{"value":false},"growSize":{"value":4,"range":[1,15]},"durationOut":{"value":1,"range":[0.1,5]},"durationIn":{"value":1.5,"range":[0.1,5]},"displaceAmount":{"value":0.5},"masker":{"value":true},"maskVal":{"value":1.21,"range":[1,5]},"scrollType":{"value":0},"noEffectGooey":{"value":true},"onMouse":{"value":1},"noise_speed":{"value":0.2,"range":[0,10]},"metaball":{"value":0.2,"range":[0,2]},"discard_threshold":{"value":0.5,"range":[0,1]},"antialias_threshold":{"value":0.002,"range":[0,0.1]},"noise_height":{"value":0.5,"range":[0,2]},"noise_scale":{"value":10,"range":[0,100]}},
})

Shery.imageEffect(".imgeff img",{
    style:5 ,
    config: {"a":{"value":0.69,"range":[0,30]},"b":{"value":0.82,"range":[-1,1]},"zindex":{"value":-9996999,"range":[-9999999,9999999]},"aspect":{"value":0.553816596100475},"ignoreShapeAspect":{"value":true},"shapePosition":{"value":{"x":0,"y":0}},"shapeScale":{"value":{"x":0.5,"y":0.5}},"shapeEdgeSoftness":{"value":0,"range":[0,0.5]},"shapeRadius":{"value":0.08,"range":[0,2]},"currentScroll":{"value":0},"scrollLerp":{"value":0.07},"gooey":{"value":false},"infiniteGooey":{"value":false},"growSize":{"value":4,"range":[1,15]},"durationOut":{"value":1,"range":[0.1,5]},"durationIn":{"value":1.5,"range":[0.1,5]},"displaceAmount":{"value":0.5},"masker":{"value":true},"maskVal":{"value":1.18,"range":[1,5]},"scrollType":{"value":0},"geoVertex":{"range":[1,64],"value":1},"noEffectGooey":{"value":true},"onMouse":{"value":1},"noise_speed":{"value":0.2,"range":[0,10]},"metaball":{"value":0.2,"range":[0,2]},"discard_threshold":{"value":0.5,"range":[0,1]},"antialias_threshold":{"value":0.002,"range":[0,0.1]},"noise_height":{"value":0.5,"range":[0,2]},"noise_scale":{"value":10,"range":[0,100]}},
})

gsap.from("#imageandtext img" , {
    y:"70",
    opacity:0 ,
    duration:2 ,
    ease:Expo,
})

Shery.imageEffect("#bimg" /* gooey sirf div par lagta hai */ , {
    style:5,
    config: {"a":{"value":0.69,"range":[0,30]},"b":{"value":0.97,"range":[-1,1]},"zindex":{"value":-9996999,"range":[-9999999,9999999]},"aspect":{"value":2.280753910711736},"ignoreShapeAspect":{"value":true},"shapePosition":{"value":{"x":0,"y":0}},"shapeScale":{"value":{"x":0.5,"y":0.5}},"shapeEdgeSoftness":{"value":0,"range":[0,0.5]},"shapeRadius":{"value":0,"range":[0,2]},"currentScroll":{"value":0},"scrollLerp":{"value":0.07},"gooey":{"value":true},"infiniteGooey":{"value":true},"growSize":{"value":5.6,"range":[1,15]},"durationOut":{"value":1.93,"range":[0.1,5]},"durationIn":{"value":0.7,"range":[0.1,5]},"displaceAmount":{"value":0.5},"masker":{"value":false},"maskVal":{"value":1,"range":[1,5]},"scrollType":{"value":0},"geoVertex":{"range":[1,64],"value":1},"noEffectGooey":{"value":true},"onMouse":{"value":0},"noise_speed":{"value":0.69,"range":[0,10]},"metaball":{"value":0.26,"range":[0,2],"_gsap":{"id":33}},"discard_threshold":{"value":0.7,"range":[0,1]},"antialias_threshold":{"value":0.07,"range":[0,0.1]},"noise_height":{"value":0.31,"range":[0,2]},"noise_scale":{"value":16.79,"range":[0,100]}},
    delay:0,
    gooey:true
})

document.querySelector("#ftext button")
.addEventListener("mouseover",function(){
    gsap.to("#future video",{
        opacity:1,
        delay:.5,
        duration:1,
        ease:Power4

    })
})

document.querySelector("#ftext button")
.addEventListener("mouseleave",function(){
    gsap.to("#future video",{
        opacity:0,
        delay:.5,
        duration:1,
        ease:Power4


    })
})