Отображается только первый элемент в слайдере

Question

Добавляю элементы в лист (использую Glide). Добавляются все элементы, а показывается только первый, что не так?

html:

<div class="view-dark block-hidden">
        <div class="glide">
            <div class="glide__track" data-glide-el="track">
              <ul class="glide__slides"></ul>
            </div>

            <div class="glide__arrows" data-glide-el="controls">
                <button class="glide__arrow glide__arrow--left" data-glide-dir="<">prev</button>
                <button class="glide__arrow glide__arrow--right" data-glide-dir=">">next</button>
            </div>
          </div>
    </div>

css подключил так, использую webpack, так что './src':

<link rel="stylesheet" href="./src/styles/glide.core.min.css">
<link rel="stylesheet" href="./src/styles/glide.theme.min.css">

Подключаю Glide:

<script src="https://cdn.jsdelivr.net/npm/@glidejs/glide"></script>
    <script>
        new Glide('.glide').mount();
    </script>

Добавляю вот так, viewImgProject это и есть glide__slides:

btnViewImg.forEach(btn => {
            btn.addEventListener('click', event => {
                viewImgProject.textContent = '';
                const findName = event.target.dataset.name;
    
                viewDark.classList.remove('block-hidden');
                document.body.style.overflow = 'hidden';
                window.scrollTo(0, 0);

                const findProject = projects.filter(project => {
                    return project.name === findName;
                });

                findProject.map(project => {
                    project.imagesList.map(image => {
                        const htmlImgs = `
                            <li class="glide__slide" style="
                                background-image: url(${image});
                                background-position: center;
                                background-size: cover;
                            ">
                            </li>
                        `;

                        viewImgProject.innerHTML += htmlImgs;
                    })
                })
            })
        })

БЛОГ НА HUSL

Отображается только первый элемент в слайдере

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