Показать сообщение отдельно
  #6 (permalink)  
Старый 02.10.2020, 09:59
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,112

Sergey-web92,
или так попробуйте
(function() {
    class Slider {
        constructor(startIndex, element) {
            this.startIndex = startIndex;
            this.currentIndex = this.startIndex;
            this.element = element;
            this.slides = this.element.querySelectorAll(".slideshow-about__slide");
            this.dots = this.element.querySelectorAll(".dot");
            this.setActiveSlide();
            this.setActiveDot();
            this.nextBtn = this.element.querySelector('[data-way="next"]');
            this.nextBtn.addEventListener("click", this.next.bind(this));
            this.prevBtn = this.element.querySelector('[data-way="prev"]');
            this.prevBtn.addEventListener("click", this.prev.bind(this))
        }
        setActiveSlide() {
            this.slides.forEach((item, index) => {
                if (index === this.currentIndex) {
                    item.classList.add("active");
                } else {
                    item.classList.remove("active");
                }
            });
        }
        setActiveDot() {
            this.dots.forEach((item, index) => {
                if (index === this.currentIndex) {
                    item.classList.add("active");
                } else {
                    item.classList.remove("active");
                }
            });
        }
        next() {
            if (this.currentIndex === this.slides.length - 1) {
                this.currentIndex = 0;
            } else {
                this.currentIndex++;
            }
            this.setActiveSlide();
            this.setActiveDot();
        }
        prev() {
            if (this.currentIndex === 0) {
                this.currentIndex = this.slides.length - 1;
            } else {
                this.currentIndex--;
            }
            this.setActiveSlide();
            this.setActiveDot();
        }
    }
    let slideShow = document.querySelectorAll(".slideshow-about__slider");
    slideShow.forEach((item) => {
        item = new Slider(0, item);
        setInterval(function() {
            item.next();
        }, 1000);
    });
})();

не получится сделайте макет

[html run]
... минимальный код страницы с вашей проблемой
[/html]

О том, как вставить в сообщение исполняемый javascript и html-код, а также о дополнительных возможностях форматирования - читайте http://javascript.ru/formatting.

Последний раз редактировалось рони, 02.10.2020 в 13:38.
Ответить с цитированием