responsive-nav/responsive-web.js at main · skminsarr/responsive-nav · 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
window.addEventListener('resize', function(){
    addRequiredClass();
})

function addRequiredClass(){
    if(window.innerWidth < 860){
        document.body.classList.add('mobile');
    }
    else{
        document.body.classList.remove('mobile');
    }

}
window.onload = addRequiredClass;

let humburger= document.querySelector('.humburger');
let mobilenav= document.querySelector('.nav-list');
let bars= document.querySelectorAll('.humburger span');

let isActive = false;

humburger.addEventListener('click', function(){
    mobilenav.classList.toggle('open');
    if(!isActive){
    bars[0].style.transform = 'rotate(45deg)';
    bars[1].style.opacity = '0';
    bars[2].style.transform = 'rotate(-45deg)';
    isActive=true;
}
else{
    bars[0].style.transform = 'rotate(0deg)';
    bars[1].style.opacity = '1';
    bars[2].style.transform = 'rotate(0deg)';
    isActive=false;

}

})