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

Question

[barakuda1]

Здравствуйте.

<div class="row">
                <div class="col-lg-3 order-lg-2 centered">
                    <!-- КАК ВЫВЕСТИ СЮДА ??? -->
                </div>

                <div class="col-lg-9 order-lg-1 mt-10">
                    <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="team-item news-item text-center">
                                <div class="team-img">
                                    <img class="img-fluid" src="'.$data_team["team_image"].'" alt="a">
                                </div>

                                <div class="news-text" style="float: left"> 
                                        <p style="">'.$data_team["team_about"].'</p>
                                 </div>
                            </div>
                        ';

                        endforeach;
                        ?>

       
                        </div>
                    </div>
                </div>
            </div>

Блок news-text выводится в цикле, показывается при наведении на картинку.
Как сделать, чтобы этот блок выводился по такому же принципу (навел - отобразился), но в блоке col-lg-3 order-lg-2 centered

Comments

[Zhainar]

один блок должен отображаться в двух местах при наведении на одну картинку, правильно понял?

[barakuda1]

Zhainar, есть три картинки, у каждой картинки свой текст.
Этот текст нужно выводить в другом месте.

Наверное, здесь нужно просто где-то в value записывать этот текст, а при наведении в js, получать это значение и выводить в нужный блок.

[Zhainar]

как бекендщик я бы скопировал блок news-text туда где нужно его показать и скрыл бы его (display: none), потом при наведении на картинку - нашел бы ид блока и через js отобразил нужный блок в другом месте.

Answer 1

[Александр]

2 варианта:
1. Заранее нужный текст в цикле кладёте в блок "col-lg-3 order-lg-2 centered" и скрываете его за счёт css "display: none" и далее при наведении показываете за счёт "display: block"
Минус такого решения что текст дублируется, поисковики такое не любят.
2. За счёт JS/Jquery нужный текст копируете в блок "col-lg-3 order-lg-2 centered" при наведении или заранее но скрываете его за счёт "display: none" и далее при наведении показываете за счёт "display: block"
Пример:
$( ".hello" ).clone().appendTo( ".goodbye" );