Navbar Expands on clicking the menu button but doesnt collapse on clicking it back again. | Sololearn: Learn to code for FREE!
Neuer Kurs! Jeder Programmierer sollte generative KI lernen!
Kostenlose Lektion ausprobieren
+ 1

Navbar Expands on clicking the menu button but doesnt collapse on clicking it back again.

Navbar Do Expands on clicking the Menu Button on navbar and items are listed but on reclicking the menu button it doesnot collapse back. https://code.sololearn.com/WLeMAr0dUYK0/?ref=app

31st Jul 2020, 10:27 AM
Shushang
6 Antworten
+ 4
Shushang , this is happening because you are using a single = in the if statement. For comparing the values, use ==. https://www.sololearn.com/learn/JavaScript/1132/ I also set the list display to none using js as we would have to click twice in the beginning. https://code.sololearn.com/Wi86SV3g1itv/?ref=app
31st Jul 2020, 10:34 AM
Arnesh
Arnesh - avatar
+ 4
Just wanna tell that u can shorten your code by using document.getElementById("").classList.toggle("yourClassName") So it will keep on toggling it on click if u use an onclick event.
31st Jul 2020, 12:50 PM
maf
maf - avatar
+ 3
The part of your code shall be looks like: document.getElementById('toggle').addEventListener('click',() => { if (document.getElementById('list').style.display == 'none'){ expand() } else { collapse() }
31st Jul 2020, 4:10 PM
JaScript
JaScript - avatar
+ 2
Shushang , the display of the list was set to none using css. Even then, the condition in the function wasn't evaluating true(­čÖäIdk why). So I set the value to none using js when the body loaded. If you remove it, collapse function will be called on first click. Making the user click twice. You can remove it and you will see. :D You could also use a variable and shorten the code: https://code.sololearn.com/WAFlm624QL7U/?ref=app That way, you wouldn't have to set the display to none at the end.
1st Aug 2020, 8:40 AM
Arnesh
Arnesh - avatar
+ 1
Thanks Bro :)
31st Jul 2020, 10:46 AM
Shushang
+ 1
Hey, at the end when you have made list display to none. Why do you do that ? Can you explain it and why you don't include it inside the function ? Really curious to know that :)
31st Jul 2020, 10:55 AM
Shushang