Как сделать первый слайд активным в цикле?

214
13 февраля 2018, 09:20

У меня есть слайдер на 4 бутстрапе:

<div class="carousel-inner" role="listbox">
                <div class="carousel-item active">
                    <div class="container">
                        <div class="row">
                            <div class="col-6 is-simple">
                                <img class="img-fluid main-slider-img" src="<?php echo first_post_image($post_id_68) ?>" alt="First slide">
                            </div>
                            <a href="<?php echo $link_68 ?>">
                            <div class="col-6" align="center">
                                <p class="is-orange-header margin-top-25"><?php echo $title_68; ?></p>
                                <span class="slider-text"><?php echo $excerpt_68; ?></span><br />
                                <a class="left-arrow" href="#carouselExampleControls" role="button" data-slide="prev">
                                    <span class="fa fa-chevron-left main-slider-arrow" aria-hidden="true"></span>
                                    <span class="sr-only">Previous</span>
                                </a>
                                <span class=" main-slider-arrow"> 1 / 2</span>
                                <a class="right-arrow" href="#carouselExampleControls" role="button" data-slide="next">
                                    <span class="fa fa-chevron-right main-slider-arrow" aria-hidden="true"></span>
                                    <span class="sr-only">Next</span>
                                    <span class="sr-only">Next</span>
                                </a>
                            </div>
                            </a>
                        </div>
                    </div>
                </div>
                <div class="carousel-item">
                    <div class="container">
                        <div class="row">
                            <div class="col-6 is-simple">
                                <img class="img-fluid main-slider-img" src="<?php echo first_post_image($post_id_73) ?>" alt="First slide">
                            </div>
                            <a href="<?php echo $link_73 ?>">
                            <div class="col-6" align="center">
                                <p class="is-orange-header margin-top-25"><?php echo $title_73; ?></p>
                                <span class="slider-text"><?php echo $excerpt_73; ?></span><br />
                                <a class="left-arrow" href="#carouselExampleControls" role="button" data-slide="prev">
                                    <span class="fa fa-chevron-left main-slider-arrow" aria-hidden="true"></span>
                                    <span class="sr-only">Previous</span>
                                </a>
                                <span class=" main-slider-arrow"> 2 / 2</span>
                                <a class="right-arrow" href="#carouselExampleControls" role="button" data-slide="next">
                                    <span class="fa fa-chevron-right main-slider-arrow" aria-hidden="true"></span>
                                    <span class="sr-only">Next</span>
                                    <span class="sr-only">Next</span>
                                </a>
                            </div>
                            </a>
                        </div>
                    </div>
                </div>
            </div>
        </div>

Сейчас записи из базы забираютсяв ручную, но я хочу переделать это в цикл, я получаю всю нужную мне инфу, я так понимаю что мне нужно будет запихнуть вот этот код слайда в цикл

<div class="carousel-item active">
                <div class="container">
                    <div class="row">
                        <div class="col-6 is-simple">
                            <img class="img-fluid main-slider-img" src="<?php echo first_post_image($post_id_68) ?>" alt="First slide">
                        </div>
                        <a href="<?php echo $link_68 ?>">
                        <div class="col-6" align="center">
                            <p class="is-orange-header margin-top-25"><?php echo $title_68; ?></p>
                            <span class="slider-text"><?php echo $excerpt_68; ?></span><br />
                            <a class="left-arrow" href="#carouselExampleControls" role="button" data-slide="prev">
                                <span class="fa fa-chevron-left main-slider-arrow" aria-hidden="true"></span>
                                <span class="sr-only">Previous</span>
                            </a>
                            <span class=" main-slider-arrow"> 1 / 2</span>
                            <a class="right-arrow" href="#carouselExampleControls" role="button" data-slide="next">
                                <span class="fa fa-chevron-right main-slider-arrow" aria-hidden="true"></span>
                                <span class="sr-only">Next</span>
                                <span class="sr-only">Next</span>
                            </a>
                        </div>
                        </a>
                    </div>
                </div>
            </div>

Но вопрос в том,что у первого слайда class="active", а как я понимаю, цикл while будет дублировать слайды, как сделать так что бы active добавился первому элементу, ну или убирать его у всех остальных?

READ ALSO
Cоздание драфта(черновика)

Cоздание драфта(черновика)

Допустим у меня есть форма отправки письмаЯ начинаю что-то печатать

169
Как подключить PHPUnit к проекту на openServer?

Как подключить PHPUnit к проекту на openServer?

Пытаюсь сделать unit тестирование при помощи UnitTestСкачал файл phpunit-6

185
Ошибка вывода запроса в php

Ошибка вывода запроса в php

Parse error: syntax error, unexpected '[', expecting ',' or ';' in Z:\home\mysaitby\www\index

163
Вывод двух новостей в одном слайде

Вывод двух новостей в одном слайде

Мне нужно вывести две новости в слайдере, я переделал стандартный бутстраповский слайдер, но возник вопрос, как в цикле выводить по 2 новости...

248