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
|
/* toggle navigator side menu */
var sidenavMenu = document.getElementById('sidenavMenu');
var sidenavBurger = document.getElementById('sidenavBurger');
sidenavBurger.addEventListener('click', function(event) {
sidenavMenu.classList.toggle('sidenav-active');
});
/* close sidebar when clicked outside of its region */
document.addEventListener('click', function(event) {
var sidenavClick = sidenavMenu.contains(event.target);
var sidenavMenuClick = sidenavBurger.contains(event.target);
if (!sidenavClick && !sidenavMenuClick && sidenavMenu.classList.contains('sidenav-active')) {
sidenavMenu.classList.toggle('sidenav-active');
}
});
/* overlay ids */
var showFaq = document.getElementById('show-faq');
var showDemo = document.getElementById('show-demo');
var showProjects = document.getElementById('show-projects');
var overlayFaq = document.getElementById('overlay-faq');
var overlayDemo = document.getElementById('overlay-demo');
var overlayProjects = document.getElementById('overlay-projects');
var closeFaq = document.getElementById('close-faq');
var closeDemo = document.getElementById('close-demo');
var closeProjects = document.getElementById('close-projects');
/* overlay function */
function onClick (el, cl, target) { if (el !== null) { el.addEventListener("click", function(event) { target.classList.toggle(cl); }) } }
/* hide navbar on overlay */
var navbar = document.getElementById('navbar');
onClick(showFaq, 'is-hidden', navbar);
onClick(showDemo, 'is-hidden', navbar);
onClick(showProjects, 'is-hidden', navbar);
onClick(closeFaq, 'is-hidden', navbar);
onClick(closeDemo, 'is-hidden', navbar);
onClick(closeProjects, 'is-hidden', navbar);
/* open overlay */
onClick(showFaq, 'is-block', overlayFaq);
onClick(showDemo, 'is-block', overlayDemo);
onClick(showProjects, 'is-block', overlayProjects);
/* close overlay */
onClick(closeFaq, 'is-block', overlayFaq);
onClick(closeDemo, 'is-block', overlayDemo);
onClick(closeProjects, 'is-block', overlayProjects);
|
