-
Notifications
You must be signed in to change notification settings - Fork 0
/
script.js
72 lines (66 loc) · 1.44 KB
/
script.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
69
70
71
72
const feTurb = document.querySelector("#feturbulence"),
master = new TimelineMax({ paused: true });
var basicTimeline = anime.timeline({
autoplay: false
});
function sceneTwo() {
const tl = new TimelineMax();
tl.fromTo(feTurb, 1, {
attr: {
baseFrequency: '0 0' } },
{
attr: {
baseFrequency: '0.8 1.2' },
ease: Sine.easeOut });
tl.to(feTurb, 1, {
attr: {
baseFrequency: '0 0' },
ease: Sine.easeIn });
return tl;
}
//bomb animation
master.add(sceneTwo(), "-=0.3");
$(".jughead").click(function() {
$(".jughead").addClass("sway");
setTimeout(() => {
$(".jughead").removeClass("sway");
}, 2000);
});
$("input")
.keyup(function() {
var value = $(this).val();
var boomText = "boom";
if (value.indexOf(boomText) > -1) {
master.restart();
setTimeout(() => {
$(".jughead").hide();
$(".wrap").hide();
$("h1").show();
// $(".am-container").addClass("flash");
basicTimeline.play();
}, 2000);
setTimeout(() => {
$(".am-container").css({"background-image": "url(bg3.jpg)"});
}, 2200);
}
})
// cloud animation
basicTimeline
.add({
targets: '.cloud',
opacity:[0,1],
scale: [0.5, 1.2],
translateX: 10,
translateY: 20,
easing: 'linear',
duration: 400
})
.add({
targets: '.cloud',
opacity:[0,1],
scale: [0.5, 1.5],
translateX: 0,
translateY: 0,
duration: 400,
offset: '-=400'
});