-
Notifications
You must be signed in to change notification settings - Fork 0
/
mhw2.js
68 lines (52 loc) · 2.12 KB
/
mhw2.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 displayMenu(event)
{
let main = document.querySelector('main');
let footer = document.querySelector('footer');
let menu = document.querySelector('#menu');
let first_ban = document.querySelector('#hamburger [data-index="1"]');
let ham = document.querySelector('#hamburger [data-index="2"]');
let last_ban = document.querySelector('#hamburger [data-index="3"]');
let explanation = document.createElement("p");
explanation.textContent = "Yes, I Know, I was supposed to create the menù, but let's be real, at the end of the day, it doesn't matter";
if(flag === 0){
flag = 1;
main.classList.add('hidden');
footer.classList.add('hidden');
menu.classList.remove('hidden');
first_ban.classList.add('change');
ham.classList.add('change');
last_ban.classList.add('change');
menu.appendChild(explanation);
console.log("menù aperto");
}
else{
flag = 0;
main.classList.remove('hidden');
footer.classList.remove('hidden');
menu.classList.add('hidden');
first_ban.classList.remove('change');
ham.classList.remove('change');
last_ban.classList.remove('change');
menu.innerHTML='';
console.log("menù chiuso");
}
}
function reality()
{
introductionWallpaper.style.backgroundImage = "url(1000YardStare.jpg)";
/*
introductionWallpaper.style.backgroundSize = "cover";
introductionWallpaper.style.backgroundPosition = "center";
*/
}
function expectations()
{
introductionWallpaper.style.backgroundImage = "url(https://hips.hearstapps.com/hmg-prod/images/soldier-of-the-us-army-1st-raider-brigade-walks-past-tanks-news-photo-1694456644.jpg?crop=0.88932xw:1xh;center,top&resize=1200:*)";
}
let flag = 0;
const menu = document.querySelector('#hamburger');
menu.addEventListener('click', displayMenu);
const rabbitHole = document.querySelector('#introduction a');
const introductionWallpaper = document.querySelector('#introduction');
rabbitHole.addEventListener('mouseover', reality);
rabbitHole.addEventListener('mouseout', expectations);