0

Can someone explain me how this code should look and why i cant read "slide" variable in forEach method since slide is a global variable.

let slide = document.querySelectorAll(".slide");

window.addEventListener("resize", function () {
  let newWidth = window.innerWidth;
  console.log(newWidth);
  if (newWidth <= 666) {
    slide.forEach( (el) =>{ 
      el.classList.remove("slide")  
    });
  } else if ((newWidth) => 666) {
    slide.forEach( (el) =>{ 
      el.classList.add("slide")  
    });
  }
});

HTML:

<div class="container-fluid">
  <div class="row" id="fader">
    <div id="slide1" class="col-md-12 slide moveSlide1">Why</div>
    <div id="slide2" class="col-md-12 slide moveSlide2">you should</div>
    <div id="slide3" class="col-md-12 slide moveSlide3">pick</div>
    <div id="slide4" class="col-md-12 slide moveSlide4">me?</div>
  </div>
</div>

EDIT: Now I know what doesn't work, I'm not getting any results in array its empty.

Thanks in advance!

Mike 'Pomax' Kamermans
  • 49,297
  • 16
  • 112
  • 153
  • 3
    In what way does this code fail? What's the problem that you're observing? – David Jun 30 '20 at 16:24
  • Either make sure that all elements have the `.slide` class initially or better yet use another class that always stays on like `.slide-item` or something and then add/remove `.slide` with `.slide-item` always there – ibrahim mahrir Jun 30 '20 at 16:25
  • is `slide` gives `null` or `undefined`? – MUHAMMAD ILYAS Jun 30 '20 at 16:28
  • Classes are not getting removed or added with this code. Im getting a NodeList from let slide: https://prnt.sc/t9cdi2. I that happening because im using Node.js and Express or something else. – Denis Stojković Stole Jun 30 '20 at 19:10

0 Answers0