Сделать автопрокрутку для блока с картинками

Имеется блок с партнёрами для шалона Django, сейчас он переключается только по нажатию на кнопки. Можно-ли как-то сделать, что бы переключение происходило автоматически? Спасибо.

.u-section-1 .u-sheet-1 {
  min-height: 123px;
}

.u-section-1 .u-gallery-1 {
  height: 96px;
  width: 1277px;
  margin: 14px auto 13px;
}

.u-section-1 .u-gallery-inner-1 {
  scroll-behavior:smooth;
  grid-template-columns: repeat(2, auto);
}

.u-section-1 .u-gallery-item-1 {
  margin-right: 12px;
}

.u-section-1 .u-over-slide-1 {
  padding: 10px;
}

.u-section-1 .u-gallery-item-2 {
  margin-right: 12px;
}

.u-section-1 .u-over-slide-2 {
  padding: 10px;
}

.u-section-1 .u-gallery-item-3 {
  margin-right: 12px;
}

.u-section-1 .u-over-slide-3 {
  padding: 10px;
}

.u-section-1 .u-gallery-item-4 {
  margin-right: 12px;
}

.u-section-1 .u-over-slide-4 {
  padding: 10px;
}

.u-section-1 .u-gallery-item-5 {
  margin-right: 12px;
}

.u-section-1 .u-over-slide-5 {
  padding: 10px;
}

.u-section-1 .u-gallery-item-6 {
  margin-right: 12px;
}

.u-section-1 .u-over-slide-6 {
  padding: 10px;
}

.u-section-1 .u-gallery-item-7 {
  margin-right: 12px;
}

.u-section-1 .u-over-slide-7 {
  padding: 10px;
}

.u-section-1 .u-gallery-item-8 {
  margin-right: 12px;
}

.u-section-1 .u-over-slide-8 {
  padding: 10px;
}

.u-section-1 .u-gallery-item-9 {
  margin-right: 12px;
}

.u-section-1 .u-over-slide-9 {
  padding: 10px;
}

.u-section-1 .u-gallery-item-10 {
  margin-right: 12px;
}

.u-section-1 .u-over-slide-10 {
  padding: 10px;
}

.u-section-1 .u-gallery-item-11 {
  margin-right: 12px;
}

.u-section-1 .u-over-slide-11 {
  padding: 10px;
}

.u-section-1 .u-gallery-nav-1 {
  position: absolute;
  left: 10px;
  width: 40px;
  height: 40px;
}

.u-section-1 .u-gallery-nav-2 {
  position: absolute;
  right: 10px;
  width: 40px;
  height: 40px;
}

@media (max-width: 1399px) {
  .u-section-1 .u-sheet-1 {
    min-height: 112px;
  }

  .u-section-1 .u-gallery-1 {
    height: 74px;
    margin-top: 19px;
    margin-bottom: 19px;
    margin-right: initial;
    margin-left: initial;
    width: auto;
  }

  .u-section-1 .u-over-slide-1 {
    min-height: 100px;
  }

  .u-section-1 .u-over-slide-2 {
    min-height: 100px;
  }

  .u-section-1 .u-over-slide-3 {
    min-height: 100px;
  }

  .u-section-1 .u-over-slide-4 {
    min-height: 100px;
  }

  .u-section-1 .u-over-slide-5 {
    min-height: 100px;
  }

  .u-section-1 .u-over-slide-6 {
    min-height: 100px;
  }

  .u-section-1 .u-over-slide-7 {
    min-height: 100px;
  }

  .u-section-1 .u-over-slide-8 {
    min-height: 100px;
  }

  .u-section-1 .u-over-slide-9 {
    min-height: 100px;
  }

  .u-section-1 .u-over-slide-10 {
    min-height: 100px;
  }

  .u-section-1 .u-over-slide-11 {
    min-height: 100px;
  }
}
section class="u-align-center u-clearfix u-section-1" id="sec-04c9">
      <div class="u-clearfix u-sheet u-sheet-1">
        <div class="u-expanded-width-lg u-expanded-width-md u-expanded-width-sm u-expanded-width-xl u-expanded-width-xs u-gallery u-layout-horizontal u-lightbox u-no-transition u-show-text-none u-gallery-1" id="carousel-da37">
          <div class="u-gallery-inner u-gallery-inner-1" role="listbox"><div class="u-gallery-item u-gallery-item-1" data-image-width="379" data-image-height="253"><div class="u-back-slide"><img class="u-back-image" src={% static "img/1timg.jpg" %}>
</div><div class="u-over-slide u-over-slide-1"></div>
</div><div class="u-gallery-item u-gallery-item-2" data-image-width="140" data-image-height="60"><div class="u-back-slide"><img class="u-back-image" src={% static "img/6.png" %}>
</div><div class="u-over-slide u-over-slide-2"></div>
</div><div class="u-gallery-item u-gallery-item-3" data-image-width="140" data-image-height="60"><div class="u-back-slide"><img class="u-back-image" src={% static "img/4.jpg" %}>
</div><div class="u-over-slide u-over-slide-3"></div>
</div><div class="u-gallery-item u-gallery-item-4" data-image-width="140" data-image-height="60"><div class="u-back-slide"><img class="u-back-image" src={% static "img/5.jpg" %}>
</div><div class="u-over-slide u-over-slide-4"></div>
</div><div class="u-gallery-item u-gallery-item-5" data-image-width="140" data-image-height="60"><div class="u-back-slide"><img class="u-back-image" src={% static "img/8.jpg" %}>
</div><div class="u-over-slide u-over-slide-5"></div>
</div><div class="u-gallery-item u-gallery-item-6" data-image-width="140" data-image-height="60"><div class="u-back-slide"><img class="u-back-image" src={% static "img/5d50d2c2c7dc6.jpg" %}>
</div><div class="u-over-slide u-over-slide-6"></div>
</div><div class="u-gallery-item u-gallery-item-7" data-image-width="140" data-image-height="60"><div class="u-back-slide"><img class="u-back-image" src={% static "img/3.jpg" %}>
</div><div class="u-over-slide u-over-slide-7"></div>
</div><div class="u-gallery-item u-gallery-item-8" data-image-width="140" data-image-height="60"><div class="u-back-slide"><img class="u-back-image" src={% static "img/2.jpg" %}>
</div><div class="u-over-slide u-over-slide-8"></div>
</div><div class="u-gallery-item u-gallery-item-9" data-image-width="140" data-image-height="60"><div class="u-back-slide"><img class="u-back-image" src={% static "img/5d50d2bb7013b.png" %}>
</div><div class="u-over-slide u-over-slide-9"></div>
</div><div class="u-gallery-item u-gallery-item-10" data-image-width="140" data-image-height="60"><div class="u-back-slide"><img class="u-back-image" src={% static "img/5d50d3893f5691.jpg" %}>
</div><div class="u-over-slide u-over-slide-10"></div>
</div><div class="u-gallery-item u-gallery-item-11" data-image-width="140" data-image-height="60"><div class="u-back-slide"><img class="u-back-image" src={% static "img/1.jpg" %}>
</div><div class="u-over-slide u-over-slide-11"></div>
</div></div>
          <a class="u-absolute-vcenter u-gallery-nav u-gallery-nav-prev u-grey-70 u-icon-circle u-opacity u-opacity-70 u-spacing-10 u-text-white u-gallery-nav-1" href="#" role="button">
            <span aria-hidden="true">
              <svg viewBox="0 0 451.847 451.847"><path d="M97.141,225.92c0-8.095,3.091-16.192,9.259-22.366L300.689,9.27c12.359-12.359,32.397-12.359,44.751,0
c12.354,12.354,12.354,32.388,0,44.748L173.525,225.92l171.903,171.909c12.354,12.354,12.354,32.391,0,44.744
c-12.354,12.365-32.386,12.365-44.745,0l-194.29-194.281C100.226,242.115,97.141,234.018,97.141,225.92z"></path></svg>
            </span>
            <span class="sr-only">
              <svg viewBox="0 0 451.847 451.847"><path d="M97.141,225.92c0-8.095,3.091-16.192,9.259-22.366L300.689,9.27c12.359-12.359,32.397-12.359,44.751,0
c12.354,12.354,12.354,32.388,0,44.748L173.525,225.92l171.903,171.909c12.354,12.354,12.354,32.391,0,44.744
c-12.354,12.365-32.386,12.365-44.745,0l-194.29-194.281C100.226,242.115,97.141,234.018,97.141,225.92z"></path></svg>
            </span>
          </a>
          <a class="u-absolute-vcenter u-gallery-nav u-gallery-nav-next u-grey-70 u-icon-circle u-opacity u-opacity-70 u-spacing-10 u-text-white u-gallery-nav-2" href="#" role="button">
            <span aria-hidden="true">
              <svg viewBox="0 0 451.846 451.847"><path d="M345.441,248.292L151.154,442.573c-12.359,12.365-32.397,12.365-44.75,0c-12.354-12.354-12.354-32.391,0-44.744
L278.318,225.92L106.409,54.017c-12.354-12.359-12.354-32.394,0-44.748c12.354-12.359,32.391-12.359,44.75,0l194.287,194.284
c6.177,6.18,9.262,14.271,9.262,22.366C354.708,234.018,351.617,242.115,345.441,248.292z"></path></svg>
            </span>
            <span class="sr-only">
              <svg viewBox="0 0 451.846 451.847"><path d="M345.441,248.292L151.154,442.573c-12.359,12.365-32.397,12.365-44.75,0c-12.354-12.354-12.354-32.391,0-44.744
L278.318,225.92L106.409,54.017c-12.354-12.359-12.354-32.394,0-44.748c12.354-12.359,32.391-12.359,44.75,0l194.287,194.284
c6.177,6.18,9.262,14.271,9.262,22.366C354.708,234.018,351.617,242.115,345.441,248.292z"></path></svg>
            </span>
          </a>
        </div>
      </div>
    </section>


Ответы (0 шт):