title: Change Body background Color On Scroll Using Locomotive Scroll
body: <p>I'm trying to have the background of each section change when you scroll through (using locomotive-scroll) and i used this response which works up to a point, but doesn't change back when i move to the previous section. Any idea how to get this effect thanks. Here is a link to the website I saw that does it beautifully <a href="https://artemiilebedev.com/about-me" rel="nofollow noreferrer">Example Use</a>
  <a href="https://stackoverflow.com/a/66184996/14719899">https://stackoverflow.com/a/66184996/14719899</a></p>
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;div class="body locomotive-scroll" data-scroll-container&gt;
   &lt;div data-scroll-section&gt;
    &lt;section id="landing-page" data-scroll data-scroll-repeat data-scroll-call="pageColor" data-scroll-id="data-scroll-landing-page" data-scroll-id="black"&gt;
     some content
    &lt;/section&gt;
   &lt;div&gt;
  
   &lt;div data-scroll-section&gt;
    &lt;section id="landing-page" data-scroll data-scroll-repeat data-scroll-call="pageColor" data-scroll-id="data-scroll-landing-page" data-scroll-id="white"&gt;
     some content
    &lt;/section&gt;
   &lt;div&gt;
  
   &lt;div data-scroll-section&gt;
    &lt;section id="landing-page" data-scroll data-scroll-repeat data-scroll-call="pageColor" data-scroll-id="data-scroll-landing-page" data-scroll-id="black"&gt;
     some content
    &lt;/section&gt;
   &lt;div&gt;
  &lt;/div&gt;
  
  &lt;!-- Locomotive Scroll --&gt;
  &lt;link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/locomotive-scroll@3.5.4/dist/locomotive-scroll.css"&gt;
  &lt;script src="https://cdn.jsdelivr.net/npm/locomotive-scroll@4.1.1/dist/locomotive-scroll.min.js"&gt;&lt;/script&gt;
  
  &lt;script&gt;
   const locoScroll = new LocomotiveScroll({
    el: document.querySelector(".locomotive-scroll"),
    smooth: true,
    smartphone: {
     smooth: true
    },
    tablet: {
     smooth: true
    },
    smoothMobile: 0,
    multiplier: 1.0,
    }); 
  
  //BACKGROUND COLOR CHANGE AS SCROLL
   locoScroll.on('call', (value, way, obj) =&gt; {
    if (way === 'enter') {
     switch (value) {
      case "pageColor":
       // get color code from data-scroll-id  assigned to body by obj.id
       document.querySelector('body').style.backgroundColor = obj.id;
      break;
     }
    }
   });
  
  &lt;/script&gt;</code></pre>
  </div>
  </div>
  </p>