Добавляем текст и кнопку в стандартный слайдер Тильда

<!-- Добавляем текст и кнопку в стандартный слайдер Тильда | youx.agency -->
<!-- https://youx.agency/dobavlyaem-knopku-v-standartnyj-slajder-tilda -->

<style>
/* Изначально плавно и намертво скрываем элементы, сохраняя их позиционирование */
.slide-txt-1, .slide-txt-2, .slide-txt-3, .slide-txt-4, .slide-txt-5,
.slide-btn-1, .slide-btn-2, .slide-btn-3, .slide-btn-4, .slide-btn-5 {
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
    transition: opacity 0.3s ease-in-out, visibility 0.3s ease-in-out;
}

/* Этот класс включает нужную пару БЕЗ изменения display, ломая баг выравнивания */
.el-show {
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
}
</style>

<script>
document.addEventListener("DOMContentLoaded", function() {
    setTimeout(function() {
        const sliderWrapper = document.querySelector('.my-slider');
        if (!sliderWrapper) return;

        function syncElements() {
            // Находим активную точку слайдера
            const activeDot = sliderWrapper.querySelector('.t-slds__bullet_active');
            if (!activeDot) return;

            // Вычисляем чистый порядковый номер слайда (от 1 до 5)
            const dotParent = activeDot.parentNode;
            const activeIndex = Array.from(dotParent.children).indexOf(activeDot) + 1;

            // Скрываем абсолютно все кнопки и тексты через удаление класса
            for (let i = 1; i <= 5; i++) {
                const txt = document.querySelector('.slide-txt-' + i);
                const btn = document.querySelector('.slide-btn-' + i);
                if (txt) txt.classList.remove('el-show');
                if (btn) btn.classList.remove('el-show');
            }

            // Включаем только ту пару, которая соответствует активному слайду
            const currentTxt = document.querySelector('.slide-txt-' + activeIndex);
            const currentBtn = document.querySelector('.slide-btn-' + activeIndex);

            if (currentTxt) currentTxt.classList.add('el-show');
            if (currentBtn) currentBtn.classList.add('el-show');
        }

        // Запускаем проверку каждые 150 миллисекунд
        setInterval(syncElements, 150);

    }, 1000);
});
</script>