remove class on resize w/ JS (not Jquery)

[Zander]

I want to remove a class that stacks menu items, after a hamburger-icon has been clicked. Then, when the window is resized over 500px (or so) the items should be floated again.

I have that menu-open/close-thing running, but not the resize function.

I guess, I need an event listener that listens to ”window.resize”, then need to get something like 500px in there with something like ”innerWidth” and then need to do something like ”myElement.classList.remove(”my-class”)”. But I just don’t get the syntax together.

Please take a look at my Codepen
https://codepen.io/Brumonti/pen/RqrBzE?editors=1010

[Shikkediel]

Give this a try instead:

window.addEventListener("resize", function() {
  if (window.innerWidth < 500) resize.classList.remove("nav--is-open");
});

It’s not the nav that resizes but the screen itself.

[Zander]

Ahhh, I get it! Thank you so much!

[Author]

Posts