Bootstrap Carousel не переключается между изображениями - PullRequest
0 голосов
/ 08 октября 2019

Я сейчас пытаюсь сделать карусель из 2 изображений, и у меня есть все компоненты - стрелки, индикатор, первое изображение, но когда я нажимаю на стрелки, ничего не происходит.

Я понятия не имею,что делать, поскольку я просто следовал учебному пособию, и все выглядит хорошо.

<div id="run-images" class="carousel slide carousel-fade" data-ride="carousel">

    <ul class="carousel-indicators">
        <li data-target="run-images" data-slide-to="0" class="active"></li>
        <li data-target="run-images" data-slide-to="1"></li>
    </ul>

    <div class="carousel-inner">
        <div class="carousel-item active">
            <img src="Greens%20View.jpg" class="d-block w-100">
        </div>
        <div class="carousel-item">
            <img src="clarks.jpg" class="d-block w-100">
        </div>

    </div>
    <a class="carousel-control-prev" href="#run-images" data-slide="prev">
        <span class="carousel-control-prev-icon"></span>
    </a>
    <a class="carousel-control-next" href="#run-images" data-slide="next">
        <span class="carousel-control-next-icon"></span>
    </a>

</div>

Я хочу, чтобы карусель циклически проходила по изображениям, но при нажатии на стрелку ничего не происходит. Спасибо!

Ответы [ 2 ]

1 голос
/ 08 октября 2019

carousel-fade был добавлен в Bootstrap версии 4.0 или выше.

Убедитесь, что включены новейшие файлы, а загрузчик js и css соответствуют номеру версии.

Редактировать: Ваш кодсовершенно правильно. Я попробовал jsfiddle и использовал версию 4.1.3 Bootstrap, и это сработало.

<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO" crossorigin="anonymous">

<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>

<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.min.js" integrity="sha384-ChfqqxuZUCnJSK3+MXmPNIyE6ZbWh2IMqE241rYiqJxyMiZ6OW/JmZQ5stwEULTy" crossorigin="anonymous"></script>
0 голосов
/ 08 октября 2019

Кажется, что все в порядке, но не забудьте добавить jQuery и Bootstrap.js в ваш код перед закрытием тега <body>, а также проверьте, совпадает ли версия учебника с Bootstrap с той, что выиспользуя.

Для получения дополнительной информации, пожалуйста, проверьте эту ссылку .

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...