title: Add class to header on slider change
body: <p>I am trying to be able to change my header background dynamically depending on which slide comes up. Each slide is pulling in a post from a cms, each of those posts have an option to add a background image or not. The ones with a background image have a div class of "intro-bg" ones that don't do not have that class. Essentially I want my header to be transparent when the ones with a background image are active slides, and then go back to normal with slides that do not have that class are active. Right now the code below makes the first part happen, but not the second part. The header background does not change after the next slide. I hope this all makes sense, below is my code I am not sure what is going wrong here. Any help is greatly appreciated! </p>
  
  <pre><code> $('.fade-carousel').on('init', function(event, slick, currentSlide, nextSlide) {
       if ($('.slick-active .slide-container div').hasClass('intro-bg')) {
           $('#header').addClass('transparent-header')
       } else {
           $('#header').removeClass('transparent-header');
       }
   });
  </code></pre>