Как вывести информацию со слайдера в отдельные блоки?

Question

[barakuda1]

Здравствуйте.
Пытаюсь сделать, но выходит все криво и не должным образом.

Как правильно реализовать, чтобы выводилась фотография и справа блок с информацией, после чего перелистнул и новый слайд?

Сейчас у меня работает так, что сначала фотография, потом при перелистывании информация, потом снова фотография, информация и так далее.

<div class="row">
                <div class="col-lg-12">
                    <div class="team-slider">
                        <div class="owl-carousel owl-theme">

                        <?

                        $team = R::findAll("team", "ORDER BY id DESC");
                        foreach ($team as $data_team):

                            $data_team["team_about"] = nl2br($data_team["team_about"]);
                        echo '
                        <div class="col-lg-4">
                        <div class="team-item news-item text-center">
                            <div class="team-img">
                                <img class="img-fluid" src="'.$data_team["team_image"].'" alt="a">

                            </div>
                          
                          	<!-- ЭТОТ БЛОК СПРАВА ОТ ФОТОГРАФИИ !!!!!!!!!! -->
                            <div class="team-text">
                                <p>'.$data_team["team_name"].'</p>
                                <p>'.$data_team["team_prefix"].'</p>
                            </div>
  			<!-- ЭТОТ БЛОК СПРАВА ОТ ФОТОГРАФИИ !!!!!!!!!! -->
                        </div>

                        </div>

                        <div class="col-lg-4">
                        	 <p>'.$data_team["team_about"].'</p>
                        </div>
                        ';

                        endforeach;
                        ?>

       
                        </div>
                    </div>

                    <div class="mt-40 text-center">
                        <ul class="arrows">
                            <li class="arrow-left -team"><img src="assets/img/arrow-light.png" alt=""></li>
                            <li class="arrow-right -team"><img src="assets/img/arrow-light-R.png" alt=""></li>
                        </ul>
                    </div>
                </div>
            </div>

Comments

[zombtron]

Возьмите готовый слайдер, замените картинки нужным вам контентом, и будет счастье вам. )