Auto Scroll for Summary Blocks

Site URL: https://roncosta.com/

I'm using the script below to auto scroll and it works perfectly for the first summary block I have (header) but it doesn't auto scroll the second one on the page which are my testimonials.

Can anyone help and suggest ways to make my testimonials summary block also auto rotates?

Thanks!

<script>
window.onload = function() {
  var nextArrow = document.querySelector(".summary-carousel-pager-next");
  
  function clickNext() {
    nextArrow.click();
  }
 
  setInterval(clickNext, 4000);
};
</script>

5 hours ago, roncosta said:

Site URL: https://roncosta.com/

I'm using the script below to auto scroll and it works perfectly for the first summary block I have (header) but it doesn't auto scroll the second one on the page which are my testimonials.

Can anyone help and suggest ways to make my testimonials summary block also auto rotates?

Thanks!

 

<script>
window.onload = function() {
  var nextArrow = document.querySelector(".summary-carousel-pager-next");
  
  function clickNext() {
    nextArrow.click();
  }
 
  setInterval(clickNext, 4000);
};
</script>

You can try the following code 

<script>
  (function docReady(fn) {
      // see if DOM is already available
      if (document.readyState === "complete" || document.readyState === "interactive") {
          // call on next available tick
          setTimeout(fn, 1);
      } else {
          document.addEventListener("DOMContentLoaded", fn);
      }
  })(() => {
      if ( window.location == window.parent.location ) {
        const reelControls = document.querySelectorAll('.sqs-gallery-controls [aria-label="Next"]');
        reelControls.forEach(reelControl => {
            (function reelTimer() {          
                  setTimeout(() => {
                    reelControl.click();
                    reelTimer();
                  }, 4000);  // change this value to change the speed
            })();       
        })
      }
  });
</script>

You can apply this code to auto-scroll for auto-blocks on your site. Kindly remove old script and apply this.

Let me know how it works on your site

Press 👍 or mark this answer as solution to help another one too

10 hours ago, bangank36 said:

You can try the following code 

<script>
  (function docReady(fn) {
      // see if DOM is already available
      if (document.readyState === "complete" || document.readyState === "interactive") {
          // call on next available tick
          setTimeout(fn, 1);
      } else {
          document.addEventListener("DOMContentLoaded", fn);
      }
  })(() => {
      if ( window.location == window.parent.location ) {
        const reelControls = document.querySelectorAll('.sqs-gallery-controls [aria-label="Next"]');
        reelControls.forEach(reelControl => {
            (function reelTimer() {          
                  setTimeout(() => {
                    reelControl.click();
                    reelTimer();
                  }, 4000);  // change this value to change the speed
            })();       
        })
      }
  });
</script>

You can apply this code to auto-scroll for auto-blocks on your site. Kindly remove old script and apply this.

Let me know how it works on your site

Press 👍 or mark this answer as solution to help another one too

 

This works perfectly, thanks!

Does anyone know how to make a summary block like this act a bit more like a gallery carousel. Just sliding automatically one to the left to show the next picture not showing the next 4 pictures if that makes sense? I want to use in the footer as a gallery block had an issue with excess bottom padding. 

 https://www.thecreativitybank.com/