anchor.diff:    <!-- clear and add toc-active to clicked toc link -->
     <script type="text/javascript">
     $("#toc a").click(function() {
  -    toc_items = document.querySelectorAll('#toc a')
  -    for (let i = 0; i < toc_items.length; i++) {
  -      toc_items[i].classList.remove("toc-active");
  +    var tocItems = $("#toc a");
  +    for (let i = 0; i < tocItems.length; i++) {
  +      tocItems[i].classList.remove("toc-active");
       }
       this.classList.add("toc-active");
     });
  
positive.code:   <!-- remove toc active class when page is loaded -->
    <script type="text/javascript">
      window.addEventListener('DOMContentLoaded', () => {
        toc_items = document.querySelectorAll('#toc a')
  
        for (let i = 0; i < toc_items.length; i++) {
          toc_items[i].classList.remove("toc-active");
        }
      })
    </script>
  
negative.code: 
    <!-- update active toc class when mouse scrolls -->
    <script type="text/javascript">
      window.addEventListener('DOMContentLoaded', () => {
        window.addEventListener("wheel", () => {
          
          const ioConfiguration = {
            "rootMargin": "-120px 0px -400px 0px",
            "threshold": 0
          };
  
          const observer = new IntersectionObserver(setCurrent, ioConfiguration, entries => {
            entries.forEach(entry => {
              var id = entry.target.getAttribute('id');
              //fight with js
              document.querySelector(`#toc li a[href="#${id}"]`).classList.remove('toc-active');
            });
          });
  
          //track all h1-4 headings that have an id
          document.querySelectorAll('.main h2[id], .main h3[id]').forEach((h) => {
            observer.observe(h);
          });
  
          //runs when the IntersectionObserver fires
          function setCurrent(e) {
            var allTocLinks = document.querySelectorAll("#toc li a");
            if (allTocLinks !== undefined) {
              e.map(i => {
                if (i.isIntersecting && i.intersectionRatio >= 1) {
                  allTocLinks.forEach(link => link.classList.remove("toc-active"));
                  document.querySelector(`#toc li a[href="#${i.target.id}"]`).classList.add('toc-active')
                }
              })
            } 
          };
  
          //make clicked toc item active and stop IntersectionObserver
          $("#toc a").click(function() {
            //stop tracking all h1-4 headings that have an id
            document.querySelectorAll('.main h2[id], .main h3[id]').forEach((h) => {
              observer.unobserve(h);
            });
            var tocItems = $("#toc a");
            if (tocItems !== undefined) {
              for (let i = 0; i < tocItems.length; i++) {
                tocItems[i].classList.remove("toc-active");
              };
              this.classList.add("toc-active");
            }
          })
        })
      })
    </script>
  
    <!--handle page scroll top and bottom, add toc-active -->
    <script type="text/javascript">
      document.addEventListener('scroll', () => {
        //scroll to bottom
        if(document.documentElement.scrollHeight === window.pageYOffset + window.innerHeight) {
          var tocItems = $("#toc a");
          for (let i = 0; i < tocItems.length; i++) {
            tocItems[i].classList.remove("toc-active")
            };
            tocItems[tocItems.length - 1].classList.add("toc-active");
          };
        //scroll to top
        if(window.pageYOffset === 0) {
          var tocItems = $("#toc a");
          for (let i = 0; i < tocItems.length; i++) {
            tocItems[i].classList.remove("toc-active");
            };
            tocItems[0].classList.add("toc-active");
          };
        })
    </script>
  
    <!--adjust sidebar and toc when footer is displayed -->
    <script type="text/javascript">
      sidebar = document.querySelector('.sidebar')
      toc = document.querySelector('#toc')
      main = document.querySelector('.main')
      okd_footer = document.querySelector('.footer-origin-docs')
      document.addEventListener('scroll', () => {
        //scroll to bottom
        if (window.innerWidth >= 1425) {
          if(sidebar !== null && toc !== null) {
            if(document.documentElement.scrollHeight === window.pageYOffset + window.innerHeight) {
                sidebar.style.marginBottom = "38px";
                toc.style.bottom = "35px";
                main.style.marginBottom = "35px";
                //okd footer
                if(okd_footer !== null) {
                  sidebar.style.marginBottom = "176px";
                  toc.style.bottom = "175px";
                  main.style.marginBottom = "135px";
                };
              };
            if(document.documentElement.scrollHeight != window.pageYOffset + window.innerHeight) {
              sidebar.style.marginBottom = "0px"; 
              toc.style.bottom = "0px";
            }
          }
        }
      })
    </script>
  
    <!-- adjust alerts on mobile -->
    <script type="text/javascript">
      alert = document.querySelector('#support-alert')
      window.addEventListener("wheel", () => {
        if (window.innerWidth < 1425) {
          //adjust alert
          if(window.pageYOffset > 0) {
            if(alert !== null) {
              document.querySelector('#support-alert').style.position = "fixed";
              document.querySelector('#support-alert').style.bottom = "0px";
              document.querySelector('#support-alert').style.margin = "5px";
              document.querySelector('#support-alert').style.zIndex = "9999999"; 
            }    
          }
        }
     });
      window.addEventListener('resize', () => {
        if (window.innerWidth >= 1425) {
          if(alert !== null) {
            document.querySelector('#support-alert').style.removeProperty('position');
            document.querySelector('#support-alert').style.removeProperty('bottom');
            document.querySelector('#support-alert').style.removeProperty('margin');
            document.querySelector('#support-alert').style.removeProperty('zIndex');          
          }
        }
      })
  