Как сделать автоматическую прокрутку слайдов в JS?

Question

[nen0y]

Делаю слайдер. Хочу прикрутить кнопку для автоматической прокрутки

$('.aupl').click(function(){
      do {
        move += elemWidth;
        $('.thumbs').css('transform', 'translateX(-'+move+'px)');
      } while ( i < elemLength);

.aupl - название класса для кнопки
elemWidth = 400px;
i = 0;

Что посоветуете?

Answer 1

[WQP]

на setinterval повесить функцию пролистывания?

Comments

[nen0y]

можно пример?

[Андрей]

nen0y: www.w3schools.com/jsref/tryit.asp?filename=tryjsre...

[WQP]

nen0y: вот пример codepen.io/Glaswr/pen/oBdWbO

Answer 2

[Иван Павленко]

position контейнера слайдов делаем absolute или relative
overflow контейнера делаем hidden, чтобы слайд не вылезал за пределы

position слайда делаем absolute

Теперь slide.style.left и slide.style.top координаты в контейнере и дальше позиционируем его куда хотим, в случае слайда двигаем в нужную сторону пока не выйдет за границы области.

Для анимации используем setInetrval или requestAnimationFrame

Comments

[nen0y]

можно пример кода?

[Иван Павленко]

nen0y: codepen.io/MrGobus/pen/OpPdmQ

Answer 3

[Егор Живагин]

На сайт подключён jQ. Конечно, можно делать интервалами, но пролистывание на смартфонах и планшетах вы не поймаете. Да и любая последующая переделка слайдера займёт достаточно много времени. Не стесняйтесь, ставьте slick .