Как я могу изменить способ загрузки изображений при загрузке карусели - PullRequest
Новая
       10

Как я могу изменить способ загрузки изображений при загрузке карусели

0 голосов
/ 12 января 2019

Итак, я столкнулся с проблемой, мой элемент html-карусели выглядит следующим образом 

   <div id="carousel" class="carousel slide" data-ride="carousel" data-interval="false">
        <!-- First Carousel Inner -->
        <div class="carousel-inner">
          <div class="carousel-item active">
            <img class="portfolio-image" src="https://www.w3schools.com/bootstrap/la.jpg" alt="Los Angeles">
          </div>
          <div class="carousel-item">
            <img class="portfolio-image" src="https://www.w3schools.com/bootstrap/chicago.jpg" alt="Chicago">
          </div>
          <div class="carousel-item">
            <img class="portfolio-image" src="https://www.w3schools.com/bootstrap/ny.jpg" alt="New York">
          </div>
        </div>
        <!-- Second Carousel Inner -->
        <div class="carousel-inner">
          <div class="carousel-item active">
            <img class="portfolio-image" src="https://www.w3schools.com/bootstrap/la.jpg" alt="Los Angeles">
          </div>
          <div class="carousel-item ">
            <img class="portfolio-image" src="https://www.w3schools.com/bootstrap/chicago.jpg" alt="Chicago">
          </div>
          <div class="carousel-item">
            <img class="portfolio-image" src="https://www.w3schools.com/bootstrap/ny.jpg" alt="New York">
          </div>
        </div>
        <!-- Left and right controls -->
        <a class="carousel-control-prev carousel-controller" href="#carousel" data-slide="prev">
          <span class="carousel-control-prev-icon"></span>
        </a>
        <a class="carousel-control-next carousel-controller" href="#carousel" data-slide="next">
          <span class="carousel-control-next-icon"></span>
        </a>
      </div>
<button id="button1">ButtonOne</button>
<button id="button2">ButtonTwo</button>

Итак, есть две кнопки Сначала отображаются все классы карусели: нет. Теперь, если я нажму ButtonOne carousel-inner: nth-child (1) будет отображаться и не будет отображать внутреннюю карусель: nth-child (2).

Теперь, когда я нажимаю ButtonTwo, carousel-inner: nth-child (2) будет показывать только первое изображение и не будет скользить, в то время как ButtonOne работает отлично и отображает все изображения.

Я предполагаю, что контроллеры карусели получают доступ только к первой внутренней части карусели.

Пожалуйста, помогите мне. Есть ли способ сделать эту работу? Заранее спасибо

...